<link rel="stylesheet" type="text/css" href="<?php echo base_url();?>assets-bustracking/css/style-drivers.css">
<main class="common_margin" id="main">
<div class="row dash-main-row">
<div class="col-md-10 col-lg-10 p-0">
<a href="<?php echo base_url()?>routes">
<button class="btn btn-dark btn-sm">Back</button>
</a>
<div class="block-head">
<h3 class="dash-tab-head"><?php echo $title; ?></h3>
</div>
<?php $bus_id=$route_id=$route_name=$driver_id=$stops=$working_id=$p_start=$d_start=''; if (isset($detailsHere) && !empty($detailsHere)) {
foreach($detailsHere as $k => $v){
$route_id = $v['id'];
$route_name = $v['route_name'];
$driver_id = $v['driver_id'];
$bus_id = $v['bus_id'];
$stops = $v['stops'];
$working_id = $v['working_id'];
$p_start = $v['pickup_start'];
$d_start = $v['drop_start'];
}
} ?>
<form method="post" id="add_route" accept="<?php echo base_url()?>add-edit-route">
<input type="hidden" name="route_id" value="<?= $route_id ?>">
<div class="row">
<div class="col-md-5 routes-left">
<input type="text" name="name" placeholder="First nameee *" class="form-control add-drivers-input driverSelect" value="<?php echo $route_name; ?>" style="margin-bottom:0;">
<select id="driverState" class="form-control driverSelect" name="bus">
<option selected>Select Bus</option>
<?php if (isset($bus_data) && !empty($bus_data)) {
foreach ($bus_data as $key => $value) {
if ($bus_id == $value['id']) {?>
<option value="<?php echo $value['id'] ?>" selected><?php echo $value['bus_brand'] ?></option>
<?php }else{
?>
<option value="<?php echo $value['id'] ?>"><?php echo $value['bus_brand'] ?></option>
<?php } }
} ?>
</select>
<div class="route-times">
<div class="times-pickup">
<p class="routes-labels">Pickup Start time</p>
<input type="time" name="pictime" id="pictime" value="<?php echo $p_start? $p_start : '00:00'; ?>">
</div>
<div class="times-drop">
<p class="routes-labels">Drop Start time</p>
<input type="time" name="droptime" id="droptime" value="<?php echo $d_start? $d_start : '00:00'; ?>">
</div>
</div>
</div>
<div class="col-md-5 routes-right">
<select id="driverState" class="form-control driverSelect stops" name="stops">
<option selected>Choose number of stops *</option>
<?php for ($i=1; $i <=10 ; $i++) {
if ($stops == $i) {?>
<option value="<?php echo $i ?>" selected><?php echo $i ?></option>
<?php }else{
?>
<option value="<?php echo $i ?>"><?php echo $i ?></option>
<?php } } ?>
</select>
<select id="driverState" name="driver" class="form-control driverSelect driver">
<option selected>Select Driver *</option>
<?php if (isset($driver_data) && !empty($driver_data)) {
foreach ($driver_data as $key => $value) {
if ($driver_id == $value['id']) { ?>
<option value="<?php echo $value['id'] ?>" selected><?php echo $value['name'] ?></option>
<?php }else{ ?>
<option value="<?php echo $value['id'] ?>"><?php echo $value['name'] ?></option>
<?php } }
} ?>
</select>
<p class="routes-labels">Select Working Days</p>
<select id="driverState" class="form-control driverSelect" name="working_day">
<option selected>Select</option>
<option value="1" <?php echo $working_id == 1 ? 'selected' :'' ?> >Mon-Fri</option>
<option value="2" <?php echo $working_id == 2 ? 'selected' :'' ?> >Mon-Sat</option>
<option value="3" <?php echo $working_id == 3 ? 'selected' :'' ?> >Mon-Sun</option>
</select>
</div>
</div>
<div class="row">
<div class="col-md-10 col-lg-10">
<div class="route-details">
<div class="route-arows">
<div class="arrow_dots_withrrowtp">
<img class="arrow-img" src="<?php echo base_url();?>assets-bustracking/images/dashboard/arrow.svg" alt="">
</div>
<div class="arrow_dots">
</div>
<div class="arrow_dots_witharrow">
<img src="<?php echo base_url();?>assets-bustracking/images/dashboard/circle.svg" alt="">
</div>
</div>
<div class="routes-display">
<?php if (isset($detailsHere) && !empty($detailsHere)) {
$i=1;
foreach ($detailsHere as $key => $value) { ?>
<div class="route-single-line" id="<?php echo $i; ?>">
<input type="hidden" name="ro_det_id[<?php echo $i; ?>]" value="<?php echo $value['details_id']; ?>">
<div class="routes-line-1">
<input type="text" name="placeName[<?php echo $i; ?>]" class="form-control driver-inputs" placeholder="Starting Point *" value="<?php echo $value['place_name']; ?>">
<input type="text" name="latitude[<?php echo $i; ?>]" class="form-control driver-inputs" placeholder="Latitude *" value="<?php echo $value['latitude']; ?>">
</div>
<div class="routes-line-2">
<input type="text" name="longitude[<?php echo $i; ?>]" class="form-control driver-input-right-1" placeholder="Longitude *" value="<?php echo $value['longitude']; ?>">
</div>
<div class="form-div">
<div class=" add-remove-btns">
<button type="button" style=" " class="add-delete-btn add-btn-click" name=" " id=" ">+</button>
</div>
<div class=" add-remove-btns remove-btn remove-btn-click">
<button type="button" class="add-delete-btn" name=" " id=" " >-</button>
</div>
</div>
<div class="preference_counter" id="route_pre">
<input class="counter_route text-center" type="text" name="conter[<?php echo $i ?>]" value="" readonly>
</div>
</div>
<?php $i++; } }else{ ?>
<div class="route-single-line" id="">
<input type="hidden" name="ro_det_id[1]" value="">
<div class="routes-line-1">
<input type="text" name="placeName[1]" class="form-control driver-inputs" placeholder="Starting Point *" value="">
<input type="text" name="latitude[1]" class="form-control driver-inputs" placeholder="Latitude *" value="">
</div>
<div class="routes-line-2">
<input type="text" name="longitude[1]" class="form-control driver-input-right-1" placeholder="Longitude *" value="">
</div>
<div class="form-div">
<div class=" add-remove-btns">
<button type="button" style=" " class="add-delete-btn add-btn-click" name=" " id=" ">+</button>
</div>
<div class=" add-remove-btns remove-btn remove-btn-click">
<button type="button" class="add-delete-btn" name=" " id=" " >-</button>
</div>
</div>
<div class="preference_counter" id="route_pre">
<input class="counter_route text-center" type="text" name="conter[1]" value="" readonly>
</div>
</div>
<div class="route-single-line" id="">
<input type="hidden" name="ro_det_id[2]" value="">
<div class="routes-line-1">
<input type="text" name="placeName[2]" class="form-control driver-inputs" placeholder="Starting Point *" value="">
<input type="text" name="latitude[2]" class="form-control driver-inputs" placeholder="Latitude *" value="">
</div>
<div class="routes-line-2">
<input type="text" name="longitude[2]" class="form-control driver-input-right-1" placeholder="Longitude *" value="">
</div>
<div class="form-div">
<div class=" add-remove-btns">
<button type="button" style=" " class="add-delete-btn add-btn-click" name=" " id=" ">+</button>
</div>
<div class=" add-remove-btns remove-btn remove-btn-click">
<button type="button" class="add-delete-btn" name=" " id=" " >-</button>
</div>
</div>
<div class="preference_counter" id="route_pre">
<input class="counter_route text-center" type="text" name="conter[2]" value="" readonly>
</div>
</div>
<?php } ?>
</div>
</div>
<button type="submit" name="submit" class="btn btn-primary student-update-btn assign-btn driver-btn btn_schedule" >Schedule</button>
</div>
</div>
</form>
</div>
</div>
</main>
<!--End right-top side-->
</div>
<script src="<?php echo base_url(); ?>assets-bustracking/js/jquery-3.4.1.min.js" ></script>
<script src="<?php echo base_url(); ?>assets-bustracking/js/popper.min.js"></script>
<script src="<?php echo base_url(); ?>assets-bustracking/js/bootstrap.min.js"></script>
<script src="https://cdn.datatables.net/1.10.22/js/jquery.dataTables.min.js"></script>
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/jquery.validate.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/additional-methods.min.js"></script>
<script>
$(document).ready(function(){
$('.user-drpdown').click(function(){
$('.drpdown-items').toggle();
});
});
</script>
<script>
$(document).ready(function(){
var route_data = '';var i='';
jQuery.validator.addMethod("inputregx", function(value, element) {
return this.optional(element) || /^[a-zA-Z ]{3,50}$/.test(value);
}, 'Please enter alpha and numeric characters only ');
jQuery.validator.addMethod("patternregx", function(value, element) {
return this.optional(element) || /^[A-Z]{2}[0-9]{2}[A-Z]{2,3}[0-9]{4}$/.test(value);
}, 'could not match the pattern ');
jQuery.validator.addMethod("checkLatitudeLongitude", function(value,element) {
return this.optional(element) || /^((\-?|\+?)?\d+(\.\d+)?),\s*((\-?|\+?)?\d+(\.\d+)?)$/.test(value);
}, 'Plaese Enter Proper Data');
$("#add_route").validate({
rules: {
<?php
for ($i = 1; $i <= 20; $i++) {
echo "'placeName[$i]': {
required:true,
inputregx:true
},";
echo "'latitude[$i]' : {
required:true,
checkLatitudeLongitude:true
},";
echo "'longitude[$i]' : {
required:true,
checkLatitudeLongitude:true
},";
} ?>
name: {
required: true,
inputregx: true
},
stops:{
required:true
},
driver:{
required:true
},
bus:{
required:true
},
working_day:{
required:true
},
placename:{
required:true,
inputregx:true
}
},
messages: {
name: {
required: "Please Enter Name"
},
stops:{
required: "Please Select Stop's"
},
driver:{
required: "Please enter Driver Name"
},
bus:{
required:"Plase Enter Bus Name"
},
working_day:{
required:"Please Select Working Day's"
}
},
submitHandler: function(form) {
form.submit();
}
});
});
</script>
<!-- script for the adding btn and deleting button -->
<script>
$(document).ready(function(){
assign_preference();
});
// Add extra field
$(document).on('click',".add-btn-click", function(e)
{
var prefer_id = '';
var id = $(this).closest('.route-single-line').attr('id');
if (id !='' && (typeof id !== "undefined")) {
prefer_id = $('.route-single-line').length + 1;
}else{
prefer_id = $('.route-single-line').length + 1;
}
// alert(id);
var data = '<div class="route-single-line"><input type="hidden" name="ro_det_id['+ prefer_id +']" value=""><div class="routes-line-1"><input type="text" name="placeName['+ prefer_id +']" class="form-control driver-inputs" placeholder="Starting Point *" value=""><input type="text" name="latitude['+ prefer_id +']" class="form-control driver-inputs" placeholder="Latitude *" value=""></div><div class="routes-line-2"><input type="text" name="longitude['+ prefer_id +']" class="form-control driver-input-right-1" placeholder="Longitude *" value=""></div><div class="form-div"><div class=" add-remove-btns"><button type="button" style=" " class="add-delete-btn add-btn-click" name=" " id=" ">+</button></div><div class=" add-remove-btns remove-btn remove-btn-click"><button type="button" class="add-delete-btn" name=" " id=" " >-</button></div></div><div class="preference_counter" id="route_pre"><input class="counter_route text-center" type="text" name="conter['+ prefer_id+']" value="" readonly></div></div>';
$(this).closest('.route-single-line').after(data);
assign_preference();
});
$(document).on('click',".remove-btn-click", function(e)
{
// $(this).closest('.route-single-line').remove();
var get_id = $(this).closest('.route-single-line').attr('id');
console.log(get_id);
if (typeof id != 'undefined' && get_id > 0) {
$.ajax({
url:'<?php echo base_url() . 'delete-route-content' ?>'+ get_id
type:'GET',
data_type:'json',
success: function(result){
}
});
}
assign_preference();
});
function assign_preference() {
var count = $('.counter_route').length;
$('.counter_route').each(function(index,ele) {
$(ele).val(index+1);
})
}
</script>
<style type="text/css">
div#route_pre {
margin-right: 0px;
display: flex;
position: absolute;
right: -10em;
top: 66px;
}
input.counter_route {
width: 30px;
border: none;
color: green;
}
</style>
</body>
</html>