<!DOCTYPE html>
<html>
<head>
	<title></title>
	<?php include("head.php");
	include "dbconfig.php";
	?>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
</head>
<body>
<form action="ajax/create_payment_entry.php" method="post">
	<div class="container-fluid" style="margin-top:200x;">
				<div class="col-md-2"></div>
				<div class="panel col-md-8">
			       <div class="panel-primary"style="box-shadow: 5px 5px 5px;">
			       	   <div class="panel-heading"><center>Recieve Payment From Customers</center></div>
			       </div>
			       <div class="panel-body" style="background-color:#e9e9e9; box-shadow: 5px 5px 5px;">
			       	 
                       <div class="form-group col-sm-3">
			       	   <select name="customer_id" id="customer" class="form-control">
			       	   	 <option style="padding:10px; background-color:#E7D91E; color:#F9F0F1; cursor:pointer;" value="">Select a Customer </option>
                               <?php
							   
							        $customers_sql="SELECT * from customers order by name ASC";
									$t_result=mysqli_query($con,$customers_sql);
									while($customer=mysqli_fetch_assoc($t_result))
									{
									
									?>
	<option style="padding:20px; background-color:#2977C9; color:#F9F0F1; cursor:pointer;" value="<?php echo $customer['id']; ?>">
	   <?php echo $customer['name']." ,Mobile:".$customer['mobile']." ,".$customer['address1']." ".$customer['post_code']; ?>
    </option>
						<?php
						
						}
						?>
			       	   </select>
			       	   </div>
                       <div class="col-md-2">
         <div class="form-group">
                      
 <input type="text" name="date" class="date form-control" placeholder="Date From" id="date">
             
         </div>
        </div>
       <div class="col-md-2">
         <div class="form-group">
                      
 <input type="number"  name="amount" class="form-control" placeholder="Enter Amount">
             
         </div>
        </div>
          <div class="col-md-4">
                   <div class="form-group">
                      
 <input type="text"  name="comments" value="N/A" class="form-control" placeholder="Enter Short Comment">
             
         </div>
        </div>
               
                       <div class="col-md-12">
                       <input type="submit" class="btn btn-success pull-right" value="Save Entry"></div>
			       	   
                       <!-- now retrieve the transactions of this customer -->
                   </div>
                   <div>&nbsp;</div>
				   <div id="customer_details"></div>
			       	    
			       </div>
			    </div>
</form>
<script>
//When user click on Start_date execute the filter
  $('.date').datepicker({
	
    	onSelect: function() {
			
			$( ".date" ).datepicker( "option", "dateFormat","yy-mm-dd");
		
               
		
    }
  
  });

	
</script>
</body>
</html>