<!DOCTYPE html>
<html lang="en">
  <?php include "head.php";
  include "dbconfig.php";
  ?>
  
   <body>

      

      <div class="container-fluid">

         <!-- Content Section -->
         
     
      <!-- To Add New Record -->
      <div class="panel col-md-6" style="background-color: #e9e9e9;box-shadow: 5px 5px 5px;">
                    
                     <div class="panel-body">
                    
                     <form method="post" id="update_car" action="ajax/update_car.php" enctype="multipart/form-data">
                        <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                           <h2>Car Details</h2>
                           <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
                             <div class="form-group">
                                 <label for="first_name">Driver Name</label>
                                  <select name="driver_id" id="driver_id" onChange="findCar();" style="width:70%;background-color:#053DD4; color:#ffffff;" class="form-control">
                               <?php
                 
                  $skip_sql="SELECT id,first_name,phone from employees order by first_name ASC";
				  
                  $t_result=mysqli_query($con,$skip_sql);
                  while($vehicle=mysqli_fetch_assoc($t_result))
                  {
                  ?>
                  
  <option style="padding:10px; background-color:#2977C9; color:#F9F0F1; cursor:pointer;" value="<?php echo $vehicle['id']; ?>">
     <?php echo $vehicle['first_name']." ". $vehicle['phone'];?>
    </option>
            <?php
            
            }
            ?>
                                </select>
                              </div>
                              <div class="form-group">
                                 <label for="phone">Car Make</label>
                                 <input type="text" id="make" name="make" placeholder="E Class Mercedes" class="form-control radius" />
                              </div>
                              <div class="form-group">
                                 <label for="mot_date">MOT Date</label>
                                 <input type="date" id="mot_date" name="mot_date" placeholder="MOT Date" class="form-control radius" />
                              </div>
                               <div class="form-group">
                                 <label for="mot_date">Insurance Date</label>
                                 <input type="date" id="insurance_date" name="insurance_date" placeholder="MOT Date" class="form-control radius" />
                              </div>
                           </div>
                           <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
                              <div class="form-group">
                                 <label for="address">Color</label>
                                 <input type="text" id="color" name="color" placeholder="Black" class="form-control radius" />
                              </div>
                              <div class="form-group">
                                 <label for="post_code">Passengers</label>
                                 <input type="text" id="passengers" name="passengers" value="4" class="form-control radius" />
                              </div>

                              <div class="form-group">
                                 <label for="post_code">Car Reg</label>
                                 <input type="text" id="reg" name="reg" value="4" class="form-control radius" />
                              </div>
                  
               <div class="form-group pull-right">
                  <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                  <input type="submit" onClick="updateCar();" class="btn btn-primary" value="Update Record" />
               </div> 
               
               </form>
            </div>
       
      </div>
      </div>
    </div>
    </div>
      <script type="text/javascript">
function findCar() {
    
	var driver_id=$('#driver_id').val();
	var dataString='driver_id='+driver_id;
	
        $.ajax({
                    type: "POST",
                    url: "ajax/find_car.php",
                    data: dataString,
                    success: function(data) {
						//alert(data);
                    var data = data.split('#');
	var id=data[0];
	var make=data[1];
	var mot_date=data[2];
	var insurance_date=data[3];
	var color=data[4];
	var reg=data[5];
		   $('#make').val(make);
		   $('#mot_date').val(mot_date);
		   $('#insurance_date').val(insurance_date);
		   $('#color').val(color);
		   $('#reg').val(reg);
          
                }
            });
   
}

function updateCar() {
    
	var form=$('#update_car');
	
        $.ajax({
                    type: "POST",
                    url: "ajax/update_car.php",
                   data:form.serialize(),
                    success: function(data) {
						alert(data);
					}
					});
}
</script>
   </body>
</html>
