<?php $this->load->view("common/header"); ?>
<!-- end: HEAD -->

<!-- start: CSS REQUIRED FOR THIS PAGE ONLY -->
s
<style type="text/css">
	label {
		font-weight: 700;
	}
	
	.table> thead:first-child> tr:first-child> th,
	.table> thead:first-child> tr:first-child> td,
	.table-striped thead tr.primary:nth-child(2n+1) th {
		background-color: #428bca;
		border-color: #357ebd;
		border-top: 1px solid #357ebd;
		color: white;
		text-align: center;
	}
	
	.form-horizontal .form-group {
		margin-left: 0;
		margin-right: 0;
	}
</style>

<!-- end: CSS REQUIRED FOR THIS PAGE ONLY -->
<!-- end: HEAD -->
<!-- start: BODY -->
<body>

	<!-- start: HEADER -->
	<div class="navbar navbar-inverse navbar-fixed-top">
		<!-- start: TOP NAVIGATION CONTAINER -->
		<div class="container">
			<div class="navbar-header">
				<!-- start: RESPONSIVE MENU TOGGLER -->
				<button data-target=".navbar-collapse" data-toggle="collapse" class="navbar-toggle" type="button"> <span class="clip-list-2"></span> </button>

				<!-- end: RESPONSIVE MENU TOGGLER -->
				<!-- start: LOGO -->
				<?php $this->load->view("common/logo"); ?>
				<!-- end: LOGO -->
			</div>
			<div class="navbar-tools">
				<!-- start: TOP NAVIGATION MENU -->
				<?php $this->load->view("common/notifications.php"); ?>
				<!-- end: TOP NAVIGATION MENU -->
			</div>
		</div>
		<!-- end: TOP NAVIGATION CONTAINER -->
	</div>
	<!-- end: HEADER -->
	<!-- start: MAIN CONTAINER -->
	<div class="main-container">
		<div class="navbar-content">
			<!-- start: SIDEBAR -->
			<?php $this->load->view("common/navigation"); ?>
			<!-- end: SIDEBAR -->
		</div>
		<!-- start: PAGE -->
		<div class="main-content">
			<!-- end: SPANEL CONFIGURATION MODAL FORM -->
			<div class="container">
				<!-- start: PAGE HEADER -->
				<div class="row">
					<div class="col-sm-12">
						<!-- start: PAGE TITLE & BREADCRUMB -->
						<ol class="breadcrumb">
							<li> <a href="#"> Dashboard </a> </li>
							<li> <a href="<?php echo base_url('sales?s='.rand()); ?>"> Invoice </a> </li>
							<li class="active"> Add Direct Invoice </li>
							<li class="search-box">
								<form class="sidebar-search">
									<div class="form-group">
										<input type="text" placeholder="Start Searching...">
										<button class="submit"> <i class="clip-search-3"></i> </button>
									</div>
								</form>
							</li>
						</ol>
						<div class="page-header">
							<h4>Direct Invoice</h4>
						</div>
						<p>Please fill in the information below. The field labels marked with * are required input fields.</p>
					</div>
				</div>
				<!-- end: PAGE HEADER -->
				<!-- start: PAGE CONTENT 
                    <!-- start grid -->
				<div class="row">
					<div class="col-sm-12">
						<!-- start: DYNAMIC TABLE PANEL -->
						<div class="panel panel-default">
							<div class="panel-heading"> <i class="fa fa-plus"></i> Add Invoice </div>
							<div class="panel-body">
								<div class="alert alert-danger" style="display:none;">
									<button class="close" data-dismiss="alert"> × </button>
									<i class="fa fa-times-circle"></i> <strong></strong> <span class="errortxt"></span> </div>
								<div class="alert alert-success" style="display:none;">
									<button class="close" data-dismiss="alert"> × </button>
									<i class="fa fa-check-circle"></i> <strong></strong><span class="succetxt"></span> </div>
								<form role="form" class="form-horizontal" id="create_sales_form" action="#" method="post">
									<div class="col-md-12">
									<!--col-md-12-->
										<div class="col-sm-2">
											<div class="form-group">
												<label>Date *</label>
												<?php $nowdate=date("Y-m-d");?>
												<input id="sale_datetime" name="sale_datetime" type='text' class="form-control date" value="" data-bv-field="date"/>
											</div>
										</div>
										<!-- ------------------------------------------------------------------------- -->
										<div class="col-sm-2">
											<div class="form-group">
												<label>Warehouse * </label>
												<select id="warehouse_id" class="form-control search-select" name="warehouse_id" onClick="load_dependent()">
                 								 <?php $ss_warehouse_id=$this->session->userdata('ss_warehouse_id'); 
                                                              foreach ($warehouse_list as $row)
                                                              {
																  $sel='';
																  if($ss_warehouse_id==$row->id)
																  {
																	  $sel=' selected="selected"';
																  }
                                                              ?>
                 											 <option value="<?php echo $row->id; ?>"> <?php echo $row->name; ?> </option>
                									  <?php }?>
                									</select>											
											</div>
										</div>
										
										<!-- ------------------------------------------------------------------------- -->
										<div class="col-sm-2">
											<div class="form-group">
												<label> Sales Representative * </label>
												<select id="sales_rep_id" class="form-control search-select" name="sales_rep_id">
													<option value="">--SELECT--</option>
													<?php 						
																	foreach ($sales_rep_list as $row)
																{?>
													<option value="<?php echo $row['user_id'];?>" <?php if(isset($sale_rep_issue_id)&&$row[ 'user_id']==$sales_rep_issue_details[ 'sales_rep_id'])echo 'selected="selected"'?>>
														<?php echo $row['user_first_name'];?>
													</option>
													<?php }  ?>
												</select>
											</div>
										</div>
										<!-- ------------------------------------------------------------------------- -->
											<div class="col-sm-2">
														<div class="form-group">
															<label>Area  * </label>
															<select id="route_id" class="form-control search-select" name="route_id" onClick="load_customer_list(this.value)"> </select>
													</div>
											</div>
											<!-- ------------------------------------------------------------------------- -->
										<div class="col-sm-2">
											<div class="form-group">
												<label>Invoice Type* </label>
												<select id="invoice_type" class="form-control search-select" name="invoice_type">
													<?php	foreach ($in_type_list as $itl){?>
													<option value="<?php echo $itl['invoice_type_id']; ?>" <?php if(isset($cus_order_details[ 'invoice_type'])&&$itl[ 'invoice_type_id']==$cus_order_details[ 'invoice_type'])echo 'selected="selected"'?> >
														<?php echo $itl['invoice_type_name']; ?> </option>
													<?php }?>
												</select>
											</div>
										</div>
										<!-- ------------------------------------------------------------------------- -->
										<div class="col-sm-2">
											<div class="form-group">
												<label>Refarance No *</label>
												<input type="text" class="form-control" id="card_ref_number" name="card_ref_number" onChange="check_recod()">
											</div>
										</div>
										<!-- ------------------------------------------------------------------------- -->
										<div class="col-sm-2">
											<div class="form-group">
												<label>Vehicle No</label>
												<input type="text" class="form-control" id="vehicle_no" name="vehicle_no">
											</div>
										</div>
										
										<!-- ------------------------------------------------------------------------- -->
										<div class="col-sm-2">
											<div class="form-group">
												<label>Driver</label>
												<input type="text" class="form-control" id="driver" name="driver">
											</div>
										</div>
										<!-- ------------------------------------------------------------------------- -->
										<div class="col-sm-3" style="margin-left: 15px; padding-left: 0px">
										<div class="form-group">
											<label for="customer_id">Customer * </label>
											<select onChange="" id="customer_id" class="form-control search-select" name="customer_id">        
											</select>
											<a id="modal_ajax_customers_btn" style="cursor:pointer;"><i style="float: left;position: absolute;margin-left: 7px;margin-top: 5px;" class="fa fa-2x fa-plus-circle addIcon" id="addIcon"> </i></a> </div>
									</div>				
									</div>
									<!-- ------------------------------------------------------------------------- -->
									
									<!--col-md-8-->

									<!-- item add box-->
									<div id="sticker" class="col-md-12">
										<div class="well well-sm">
											<div class="form-group">
												<!-- auto complete start -->
												<div class="input-group wide-tip">
													<div style="padding-left: 10px; padding-right: 10px;" class="input-group-addon"> <i class="fa fa-2x fa-barcode addIcon"></i> </div>
													<input type="text" placeholder="Please add products to order list" id="add_item" class="form-control input-lg" value="" name="add_item" onClick="add_items()" style="border-radius: 6px;font-size: 18px;height: 46px;line-height: 1.33;padding: 10px 16px;">
													<!--<div style="padding-left: 10px; padding-right: 10px;" class="input-group-addon">
															<i id="addIcon" class="fa fa-2x fa-plus-circle addIcon"></i>

														</div>-->
												</div>
												<!-- end auto complete end -->

											</div>
											<div class="clearfix"></div>
											<div class="control-group table-group">
												<label class="table-label">Order Items</label>
												<div class="controls table-controls">
													<table class="table items table-striped table-bordered table-condensed table-hover" id="soTable">
														<thead>
															<tr>
																<th class="col-md-7">Product Name (Product Code)</th>
																<th class="col-md-2">Selling Price</th>
																<th class="col-md-1">Quantity</th>
																<th class="col-md-1 text-right">Discount </th>
																<th class="col-md-1 text-right">Subtotal<span class="currency"></span> </th>
																<th style="width: 30px !important; text-align: center;"><i class="fa fa-trash-o"></i> </th>
															</tr>
														</thead>
														<tbody>
															<tr data-item-id="144680019784" class="row_144680019784" id="row_1446800197032">
																<td></td>
																<td class="text-right"></td>
																<td></td>
																<td class="text-right"></td>
																<td class="text-right"></td>
																<td class="text-center"></td>
															</tr>
														</tbody>
														<tfoot>
															<!--<tr class="tfoot active" id="tfoot">
																	<th colspan="2">Total</th>
																	<th class="text-center"><span id="qtyTotal">0.00</span></th>
																	<th class="text-right"><span id=""> 0.00</span></th>
																	<th class="text-right">0.00</th>
																	<th class="text-right"><span id="Subtotal">00.00</span></th>
																	<th class="text-center"><i class="fa fa-trash-o"></i></th>
																</tr>-->

															<tr class="tfoot active" id="tfoot">
																<th colspan="4" class="text-right">Total Amount</th>
																<th class="text-right"><span id="Subtotal">0.00</span> </th>
															</tr>
															<!-- <tr class="tfoot active" id="tfoot">
																	<th colspan="4" class="text-right">Paid </th>
																	<th class="text-right">
                                                                    <input type="text" onChange="changePaidValue(this.value);" onClick="this.select(); setTmpVal(this.value);" id="paid" value="0.00" name="paid" class="form-control text-right rquantity">
                                                                    </th>
																	
																</tr>
                                                                <tr class="tfoot active" id="tfoot">
																	<th colspan="4" class="text-right">Balance </th>
																	<th class="text-right"><span id="balance_dis">0.00</span></th>
																	
																</tr>-->
														</tfoot>
													</table>

													<!-- start list -->
													<!-- end list -->
												</div>
											</div>
										</div>
										<!-- end item add box-->
										<div class="col-md-2">
											<div class="form-group">
												<label>Order Discount</label>
												<br>
												<input type="text" title="" data-original-title="" value="" class="form-control input-tip" id="sale_inv_discount" name="sale_inv_discount" onChange="changeMainDiscount(this.value)">
											</div>
										</div>
									</div>

									<!-- end: col-md-12-->

									<div class="col-md-12">
										<div class="modal-footer" style="margin-bottom:10px;">
											<input type="submit" class="btn btn-primary" value="Add Sales" name="add_sale" id="add_sale">
											<button id="reset" class="btn btn-danger" type="button">Reset</button>
										</div>
									</div>
									<input name="sale_inv_discount_amount" type="hidden" id="sale_inv_discount_amount" value="0">
									<input name="sale_total" type="hidden" id="sale_total" value="0">
									<input name="sale_paid" type="hidden" id="sale_paid" value="0">
									<input name="sale_balance" type="hidden" id="sale_balance" value="0">
									<input name="rowCount" type="hidden" id="rowCount" value="0">
									<input name="cost_total" type="hidden" id="cost_total" value="0">
									<input name="cus_credit_limit" type="hidden" id="cus_credit_limit" value="10000">
									<input name="base_url" type="hidden" id="base_url" value="<?php echo base_url();?>">
									<input name="direct_sale" type="hidden" id="direct_sale" value="1">
								</form>

								<!-- end: DYNAMIC TABLE PANEL -->

								<!-- footer amount details -->
								<!--<div style="margin-bottom: 0px; position: fixed; bottom: 0px; width: 1082px; z-index: 50000;" class="well well-sm" id="bottom-total">
<table style="margin-bottom:0;" class="table table-bordered table-condensed totals">
<tbody><tr class="warning">
<td width="20%" class="credit_limit_td_class">Credit Limit <span id="credit_limit_txt" class="credit_limit_val pull-right">0.00</span></td>
<td class="previous_bill_td_class" style="display:none;">Previous Bill <span id="previous_bill_txt" class="pull-right">0.00</span></td>
<td width="30%">Total <span id="f_total" class="totals_val pull-right">0.00</span></td>
<td width="20%">Order Discount <span id="tds" class="totals_val pull-right">0.00</span></td>
<td>Grand Total <span id="gtotal" class="totals_val pull-right">0.00</span></td>
</tr>
</tbody></table>
</div>-->
								<!-- end footer amount details -->

							</div>
						</div>

						<!-- end grid -->

					</div>
					<!-- end: PAGE -->
				</div>
				<!-- end: MAIN CONTAINER -->
				<!-- start: FOOTER -->
				<div class="footer clearfix">
					<div class="footer-inner"> 2014 &copy; clip-one by cliptheme. </div>
					<div class="footer-items"> <span class="go-top"><i class="clip-chevron-up"></i></span> </div>
				</div>
				<!-- end: FOOTER -->
				<!-- start: RIGHT SIDEBAR -->
				<!-- end: RIGHT SIDEBAR -->
				<div id="event-management" class="modal fade" tabindex="-1" data-width="760" style="display: none;">
					<div class="modal-dialog">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal" aria-hidden="true"> &times; </button>
								<h4 class="modal-title">Event Management</h4>
							</div>
							<div class="modal-body"></div>
							<div class="modal-footer">
								<button type="button" data-dismiss="modal" class="btn btn-light-grey"> Close </button>
								<button type="button" class="btn btn-danger remove-event no-display"> <i class='fa fa-trash-o'></i> Delete Event </button>
								<button type='submit' class='btn btn-success save-event'> <i class='fa fa-check'></i> Save </button>
							</div>
						</div>
					</div>
				</div>
				<input name="tmpVal" type="hidden" id="tmpVal" value="0">
				<input name="" id="type_sale" type="hidden" value="22">
				<!-- start ajax model -->
				<div id="ajax-modal" class="modal fade" data-backdrop="static" data-keyboard="false" tabindex="-1" style="display: none;"></div>
				<!-- end ajax model -->

				<!-- start: MAIN JAVASCRIPTS -->
				<?php $this->load->view("common/footer"); ?>
				<!-- end: MAIN JAVASCRIPTS -->
				<!-- start: JAVASCRIPTS REQUIRED FOR THIS PAGE ONLY VALIDATION-->
				<script src="<?php echo asset_url(); ?>js/form-validation-create_sales.js"></script>
				<script src="<?php echo asset_url(); ?>js/sales.js"></script>
				<!-- end: JAVASCRIPTS REQUIRED FOR THIS PAGE ONLY  VALIDATION-->

				<script>
					$( document ).ready( function () {		
						load_dependent()
						clearForm();
						$( '#in_type' ).focus();
						calculateTotal();
						$( ".noEnterSubmit" ).on( 'keyup', function ( e ) {
							// if (e.keyCode == 13) {
							// Do something
							// }
						} );
						$( '#add_sale' ).keypress( function ( event ) {
							//  if(event.keyCode == 13) {
							//   event.preventDefault();
							//   return false;
							// }
						} );
						$( window ).keydown( function ( event ) {
							$( ":focus" ).each( function () {
								focus_id = this.id;
								var rowCount = $( '#rowCount' ).val();
								var fld = 'quantity_' + rowCount;
								if ( focus_id == fld ) {
									if ( event.keyCode == 16 ) {
										$( '#add_item' ).focus();
									}
								}
								if ( event.keyCode == 18 ) {
									calculateTotal();
									setTimeout( function () {
										$( "#create_sales_form" ).submit()
									}, 1000 );
								}
								if ( event.keyCode == 13 ) {
									event.preventDefault();
									return false;
								}
							} );
						} );
					} );

				//--------------------------------------------------------------------
					function addextraprice() {
						calculateTotal();
					}				
				//---------------------------------------------------------------------
					/*$(document).ready(function() {
					  $(window).keydown(function(event){
					    if(event.keyCode == 13) {
					      event.preventDefault();
					      return false;
					    }
					  });
					});*/
				//-----------------------------------------------------------------------
					$( '#add_item' ).keypress( function ( e ) {
						if ( e.which == 13 ) return false;
						//or...
						if ( e.which == 13 ) e.preventDefault();
					} );
				//-----------------------------------------------------------------------
					function changeQtyByProductID( qty, nxtCount ) {
						if ( isNaN( qty ) ) {
							displayNotice( 'page', 'Invalid Quantity' );
							var quantity_fld = '#quantity_' + nxtCount;
							var product_id_fld = '#product_id' + nxtCount;
							var oldVal = $( '#tmpVal' ).val();
							$( quantity_fld ).val( oldVal ); //set last val
						} else {
							//getavalable product count
							var product_id_fld = '#product_id' + nxtCount;
							var product_id = $( product_id_fld ).val();
							var availble_qty_fld = '#qtyforcheck_' + nxtCount;
							var availble_qty = parseFloat( $( availble_qty_fld ).val() );
							if ( qty <= availble_qty && qty > 0 ) {
								var warehouse_id = $( '#warehouse_id' ).val();
								$.get( "<?php echo base_url();?>sales/get_avalable_product_qty", {
										product_id: product_id,
										warehouse_id: warehouse_id
									} )
									.done( function ( data ) {
										var obj = jQuery.parseJSON( data );
									} );
								//end getavalable product count
								calculateTotal();
								//displayNotice('page','Product quantity successfully updated!');		
							} else {
								if ( qty > availble_qty ) {
									bootbox.alert( 'Out of stock.', function () {
										$( '#quantity_' + nxtCount ).focus();
									} );
								}
								if ( qty <= 0 ) {

									bootbox.alert( 'System cannot accept your quntity requirement.', function () {
										$( '#quantity_' + nxtCount ).focus();
									} );
								}

								$( '#quantity_' + nxtCount ).val( 1 );
								calculateTotal();
							}
						}
					}
					//-----------------------------------------------------------------------
					function insertSalesData() {
						var type = 'A';
						var sale_reference_no = $( '#sale_reference_no' ).val();
						var fields = $( "#create_sales_form" ).serialize();
						var rowCount = $( '#rowCount' ).val();
						if ( rowCount != 0 ) {
							$( "#add_sale" ).prop( "disabled", true );
							$( "#add_sale" ).val( 'Please wait...' );
							// create_sales_form.add_sale.disabled = true;
							// create_sales_form.add_sale.value = "Please wait...";
							//	return true;
							//type:type, sale_reference_no:sale_reference_no
							$.post( "<?php echo base_url();?>sales/save_direct_sale", fields )
								.done( function ( data ) {
									var obj = jQuery.parseJSON( data );
									if ( obj.error == 1 ) {
										$( '.alert-success' ).hide();
										$( '.alert-danger' ).show();
										$( ".errortxt" ).text( obj.disMsg );
										window.scrollTo( 500, 0 );
										//empty item table				
									}
									if ( obj.error == 0 ) {
										window.scrollTo( 500, 0 );
										$( "#soTable > tbody" ).empty();
										displayNotice( 'page', 'Sale successfully added!' );
										clearForm();
										//empty footer details				
										sendUrl = '<?php echo base_url()?>sales/view/' + obj.sale_id;
										window.location.href = sendUrl;
									}
								} );
							return false;
						} else {
							bootbox.alert( 'Please add products.', function () {
								$( '#add_item' ).focus();
							} );
						}
					}
				//-----------------------------------------------------------------------
					function add_items() {
						//ItemnTotals();
						$( "#add_item" ).autocomplete( {
							source: '<?php echo base_url();?>sales/sale_product_suggestions?t=' + $( "#invoice_type" ).val() + '&WH=' + $( "#warehouse_id" ).val(),
							minLength: 1,
							autoFocus: false,
							delay: 5,
							response: function ( event, ui ) {
								if ( ui.content.length == 1 && ui.content[ 0 ].product_id != 0 ) {
									//ui.item = ui.content[0];
									//$(this).data('ui-autocomplete')._trigger('select', 'autocompleteselect', ui);
									//$(this).autocomplete('close');
									// $(this).removeClass('ui-autocomplete-loading');
								} else if ( ui.content.length == 0 ) {
									var noResult = {
										value: "",
										label: "No matching result found! Product might be out of stock in the selected warehouse."
									};
									ui.content.push( noResult );
								} else {
								}
							},
							select: function ( event, data ) {
								if ( data.item.value ) {
									//check is added prodcut
									rowCount = parseInt( $( '#rowCount' ).val() );
									var tmp = '';
									if ( rowCount ) {
										tmp = isAddedProduct( data.item.product_id, data.item.qtyforcheck );
									}
									if ( tmp == "error" ) {
										alert( "error" );
									}
									if ( !tmp ) {
										addProductToListByID( data.item.product_id, data.item.product_name, data.item.product_code, data.item.product_price, data.item.product_part_no, data.item.product_oem_part_number, data.item.item_cost, data.item.qtyforcheck, data.item.down_payment, data.item.rep_commision, data.item.daily_rental_days, data.item.per_day_rental, data.item.sales_rep_issue_id );
										//$('#in_type').select2("enable", false)
										//$( '#in_type option:not(:selected)' ).prop( 'disabled', true );
										//$( '#customer_id option:not(:selected)' ).prop( 'disabled', true );
										$( '#customer_id' ).select2( "readonly", true );
										//$( '#invoice_type' ).select2( "readonly", true );
										$( '#invoice_type option:not(:selected)' ).prop( 'disabled', true );
										$( '#warehouse_id option:not(:selected)' ).prop( 'disabled', true );
									} else {
										calculateTotal();
									}
									$( "#add_item" ).val( '' );
									return false;
								}
								$( this ).autocomplete( 'close' );
								$( this ).removeClass( 'ui-autocomplete-loading' );
							}
						} );
					}
					//-----------------------------------------------------------------------
					$( window ).scroll( function () {
						if ( $( window ).scrollTop() + $( window ).height() == $( document ).height() ) {
							$( '#bottom-total' ).css( {
								position: 'static',
								width: '100%'
							} );
						} else {
							$( '#bottom-total' ).css( {
								position: 'fixed',
								width: '1082px'
							} );
						}
					} );
				//-----------------------------------------------------------------------
					//function to initiate bootstrap-datepicker
					$( function () {
						//showKeys();
						var currentDate = new Date();
						$( '#sale_datetime' ).datetimepicker( {
							defaultDate: new Date()
						} );
						$( ".search-select" ).select2();
					} );
					//-----------------------------------------------------------------------
					function check_recod() {
						$.post( "<?php echo  base_url(); ?>sales/check_recod?CRN=" + $( "#card_ref_number" ).val(), function ( data ) {
							//window.alert(fields);
							var obj = jQuery.parseJSON( data );
							//window.alert(data);
							if ( obj == 0 ) {} else {
								bootbox.alert( 'This card number already issued. Please try differant card Number', function () {
									$( '#card_ref_number' ).focus();
									document.getElementById( "card_ref_number" ).value = "";
								} );
							}
						} );
					}
					//-----------------------------------------------------------------------
					function load_dependent() {
						load_areas();
						load_customer_list(0);
						//load_salse_reps();
					}
					//-----------------------------------------------------------------------
					function load_areas() {
							var x = document.getElementById( "route_id" );
							x.remove( x.selectedIndex );
							$.post( "<?php echo  base_url(); ?>area/get_all_area_by_warehouse_id?WH=" + $( "#warehouse_id" ).val(), function ( data ) {
								var sel = $( "#route_id" );
								sel.empty();
								$( "#route_id" ).append( '<option value="" > Select Area</option>' );
								$.each( data, function ( i, item ) {
									$( "#route_id" ).append( '<option value="' + i + '">' + item + '</option>' );
								} )
							}, "json" );
						}
				  //------------------------------------------------------------------
					function load_customer_list( area_id ) {
						var x = document.getElementById( "customer_id" );
						x.remove( x.selectedIndex );

						$.post( "<?php echo  base_url(); ?>sales/get_list_customer_by_area_id?area_id=" + area_id, function ( data ) {

							var sel = $( "#customer_id" );
							sel.empty();
							$( "#customer_id" ).append( '<option value="" >-SELECT-</option>' );
							$.each( data, function ( i, item ) {
								$( "#customer_id" ).append( '<option value="' + i + '">' + item + '</option>' );
							} )
						}, "json" );
					}

					$( 'a#modal_ajax_vehicle_btn' ).on( 'click', function () {
						// create the backdrop and wait for next modal to be triggered
						$( 'body' ).modalmanager( 'loading' );
						setTimeout( function () {
							$modal.load( '<?php echo base_url("vehicle/add_vehicle"); ?>', '', function () {
								$modal.modal();
							} );
						}, 1000 );
					} );
					$( 'a#modal_ajax_driver_btn' ).on( 'click', function () {
						// create the backdrop and wait for next modal to be triggered
						$( 'body' ).modalmanager( 'loading' );
						setTimeout( function () {
							$modal.load( '<?php echo base_url("drivers/add_driver"); ?>', '', function () {
								$modal.modal();
							} );
						}, 1000 );
					} );
				</script>
</body>
<!-- end: BODY -->

</html>