<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/js/bootstrap-datepicker.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.4.1/css/bootstrap-datepicker3.css"/>
 <script src="https://cdn.jsdelivr.net/jquery.validation/1.16.0/additional-methods.min.js"></script>
 <script src="<?php echo base_url()?>/public/validation/js/jquery.validate.js"></script>
  <script src="<?php echo base_url();?>public/admin_assets/plugins/select2/select2.full.min.js"></script>
<!-- Content Wrapper. Contains page content -->
      <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
          <h3>
            Job Settings
            
          </h3>         
        </section>

        <!-- Main content -->
        <section class="content"> 
			<div class="row">
				<!-- general form elements -->
				<div class="col-md-12">
					  <div class="box box-primary">
						<div class="box-header with-border">
						<div class="admin-tab-wrapper">
							<div class="admin_tab">
								<!--<button class="btn btn-primary dropdown-toggle btn-algnmt" type="button" data-toggle="dropdown">Action
								<span class="caret"></span></button>-->
								<ul>
									<li><a href="<?=base_url()?>admin/job">Back</a></li>
								</ul>
							</div>
						</div>
						  <h3 class="box-title"></h3>
						   <?php if($this->session->flashdata('error_msg')){?>
								<span style="color:red; font-weight:bold"><?php echo $this->session->flashdata('error_msg');?></span>
							<?php }?>
							<?php if($this->session->flashdata('success_msg')){?>
								<span style="color:green; font-weight:bold"><?php  echo $this->session->flashdata('success_msg'); ?></span>
							<?php }?>
						</div>
						<!-- /.box-header -->
						<!-- form start -->
						<form id="signupForm" role="form" class="mtbresize" method="post" action="<?php echo base_url('admin/job/contenta');?>" enctype="multipart/form-data" autocomplete="off">
						  <div class="box-body">							
							<div class="form-group">
							  <label for="car">Car<sup class="superr">*</sup></label>
							  <select class="form-control" id="car" name="car">
								<option value="">Select</option>
								<?php foreach($cars as $car){?>
									<option value="<?php echo $car['car_id']; ?>"><?php echo $car['car_no']; ?></option>
								<?php } ?>	
							  </select>
							  <?php echo form_error('car','<span class="error">', '</span>'); ?>
							</div>
							<div class="form-group">
							  <label for="service_date">Service Date<sup class="superr">*</sup></label>
								<div class='input-group date'>
									<input type='text' class="form-control" placeholder="Service Date" id="service_date" name="service_date" value="<?php echo set_value('service_date');?>"/>
									<span class="input-group-addon">
										<span class="glyphicon glyphicon-calendar"></span>
									</span>
								</div>
								<?php echo form_error('expiry_date','<span class="error">', '</span>'); ?>
							</div>	
							<div class="form-group">
							  <label for="mechanic">Mechanic<sup class="superr">*</sup></label>
							  <select class="form-control" id="mechanic" name="mechanic">									
							  </select>
							  <?php echo form_error('mechanic','<span class="error">', '</span>'); ?>
							</div>							
							<div class="form-group">
							  <label>Service<sup class="superr">*</sup></label>
							  <select class="form-control select2" name="service[]" id="service" required multiple="multiple">
								<?php foreach($services as $service){?>
									<option value="<?php echo $service['service_id']; ?>"><?php echo $service['service_name'] ?></option>
								<?php }?>
							  </select>
							    <?php echo form_error('service','<span class="error">', '</span>'); ?>
							</div>	
							
																			
						  </div>
						  <!-- /.box-body -->
						  <div class="box-footer">							
							<button type="submit" class="btn btn-sm btn-primary">Submit</button>
						  </div>
						</form>
					  </div>
				</div>
          <!-- /.box -->
          </div><!-- /.row -->	
        </section><!-- /.content -->
      </div><!-- /.content-wrapper -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-show-password/1.0.3/bootstrap-show-password.min.js"></script>
<script>

$('#service_date').datepicker({
	format: 'dd/mm/yyyy',
	startDate: new Date()
});

$( "#signupForm" ).validate( {
					rules: {
						car:"required",	
						mechanic:"required",
						service:"required",
						service_date: "required"					
						
					},
					messages: {	
						car: {required:"Car field is required"},
						mechanic:{required:"Mechanic field is required"},	
						service:{required:"Service field is required"},
						service_date: {required:"Service Date field is required"}
						
						
					},
					errorElement: "em",
					
					highlight: function ( element, errorClass, validClass ) {
						$( element ).parents( ".form-control" ).addClass( "has-error" ).removeClass( "has-success" );
					},
					unhighlight: function (element, errorClass, validClass) {
						$( element ).parents( ".form-control" ).addClass( "has-success" ).removeClass( "has-error" );
					}
				} );


$('#service_date').on('changeDate', function(event, date) {
	var content ='<option value="">Select</option>';	
    var date = $('#service_date').val();
    
	$.ajax({
		  type:'POST',
		  url :'<?php echo base_url('admin/job/getmechanicList');?>',
		  data:'date='+date,
		  dataType:'json',
		  success:function(result){			  
			$.each( result.new_mechanic_list, function( key, value ) {
				 content+='<option value="'+value.admin_id+'">'+value.first_name+' '+value.last_name+'</option>';			  
				$("#mechanic").html(content);
			});	
		  } ,error:function(){		 

		  }
	   });
});

$(".select2").select2();

$(document).ready(function(){
	$("#mechanic").html('<option value="">Select</option>');
});
	
</script>