CSS
<![CDATA[
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
.clear_product {
display:none;
position: absolute;
border-radius: none;
left:96.5%;
z-index: 2;
border: none;
top:5px;
cursor: pointer;
color: white;
background-color: #f21505;
transform: translateX(2px);
padding:3px;
}
.table th, .table td{
padding:1px;
}
.form-control{
border-radius:0px;
}
.table td{
border:none;
}
.btn_add{
background-color: #166e23;
padding:1px 10px;
color: white;
position:relative;
top:-2px;
font-size:28px;
font-weight:bold;
}
.btn_delete{
background-color: #f21505;
padding: 0px 12px 0px 12px;
color: white;
position:relative;
top:-2px;
font-size:22px;
font-weight:bold;
}
]]>
View
<![CDATA[
<table class="table key_navigation item_container" id="example" style="margin-bottom:0px;">
<thead>
<tr>
<?php if($block_editing!=1){?>
<th></th>
<?php } ?>
<th style="width:50%;border-bottom:none;">Fish Name</th>
<th style="border-bottom:none;">Quantity</th>
<th style="border-bottom:none;">Purchase Date</th>
<th style="border-bottom:none;">Price</th>
<th style="border-bottom:none;">Total</th>
</tr>
</thead>
<tbody style="min-height:250px;">
<?php
if(isset($itemsData) && count($itemsData) > 0){
foreach($itemsData as $val){
?>
<tr >
<?php if($block_editing!=1){?>
<td><a href="javascript:void(0)" class="btn_delete" style="display:block">x</a></td>
<?php } ?>
<td style="width:50%">
<div style="position:relative"><span class="clear_product">X</span> </div>
<input class="form-control autocomplete" name="title[]" value="{!! isset( $val->title) ? $val->title : '' !!}" {{$block_editing==1 ? 'disabled' : ''}}>
<input type="hidden" class="fish_id" name="fish_id[]" value="{!! isset( $val->fish_id) ? $val->fish_id : '' !!}" >
</td>
<td ><input type="text" class="form-control quantity only-numeric" name="quantity[]" value="{!! isset( $val->quantity) ? $val->quantity : '' !!}" style="text-align:right" {{$block_editing==1 ? 'disabled' : ''}}></td>
<td ><input type="text" class="form-control purchase_date1 datetimepicker " name="purchase_date[]" value="{!! isset( $val->purchase_date) ? date('d-m-Y', strtotime($val->purchase_date)) : '' !!}" style="text-align:right" {{$block_editing==1 ? 'disabled' : ''}}></td>
<td ><input type="text" class="form-control price allow_decimal" name="price[]" value="{!! isset( $val->price) ? $val->price : '' !!}" style="text-align:right" {{$block_editing==1 ? 'disabled' : ''}}></td>
<td ><input type="text" class="form-control item_total" name="item_total[]" value="{!! isset( $val->item_total) ? $val->item_total : '' !!}" readonly style="text-align:right" placeholder="" {{$block_editing==1 ? 'disabled' : ''}}></td>
</tr>
<?php } }
else{ ?>
<tr >
<td><a href="javascript:void(0)" class="btn_delete" style="display:block">x</a></td>
<td style="width:20%" >
<div style="position:relative"><span class="clear_product">X</span> </div>
<input class="form-control autocomplete " name="title[]">
<input type="hidden" class="fish_id" name="fish_id[]">
</td>
<td ><input type="text" class="form-control quantity only-numeric" name="quantity[]" style="text-align:right" ></td>
<td ><input type="text" class="form-control purchase_date datetimepicker" name="purchase_date[]" style="text-align:right" ></td>
<td ><input type="text" class="form-control price allow_decimal" name="price[]" style="text-align:right"></td>
<td ><input type="text" class="form-control item_total" name="item_total[]" readonly style="text-align:right" placeholder="" ></td>
</tr>
<?php } ?>
</tbody>
</table>
]]>
Script
<![CDATA[
$('.datetimepicker').datetimepicker({
dayOfWeekStart : 0,
lang:DATE_TIME_PICKER_LANG,
format:'d-m-Y',
timepicker:false,
// datepicker:false,
// maxDate:DATE_TIME_PICKER_MINDATE,
allowTimes:DATE_TIME_PICKER_TIMES,
});
$('body').on("keyup", ".autocomplete" , function() {
var length=$(this).val().length;
target=$(this);
$(this).parent().parent().find('.clear_product').hide();
if(length>0){
$(this).parent().parent().find('.clear_product').show();
}
else{
target.parent().parent().find('.fish_id').val('');
target.parent().parent().find('.quantity').val('');
target.parent().parent().find('.price').val('');
//target.parent().parent().find('.price').val('');
target.parent().parent().find('.item_total').val(0);
updateGrandTotal();
}
});
$('body').on("click", ".clear_product" , function() {
$(this).parent().parent().find('.autocomplete').val('');
target=$(this);
target.parent().parent().parent().find('.fish_id').val('');
target.parent().parent().parent().find('.quantity').val('');
target.parent().parent().parent().find('.price').val('');
// target.parent().parent().parent().find('.price').val('');
target.parent().parent().parent().find('.item_total').val(0);
$(this).hide();
updateGrandTotal();
});
$('body').on('focus', '.autocomplete', function (e) {
target=$(this);
$(this).autocomplete({
source: function( request, response ) {
$.ajax({
url: FISH_SEARCH,
type: 'get',
dataType: "json",
data: {
search: request.term
},
headers: {
// 'X-MAC-ID': $('#mac_id').val(),
// 'X-CLIENT-KEY' : $('#client_key').val(),
// 'Authorization' : 'Bearer '+token
},
success: function( data ) {
numItems=Object.keys(data).length;
switch(numItems){
case 0:
target.val('');
target.parent().parent().find('.fish_id').val('');
target.parent().parent().find('.quantity').val('');
target.parent().parent().find('.price').val('');
//target.parent().parent().find('.price').val('');
target.parent().parent().find('.item_total').val(0);
updateGrandTotal();
target.focus();
break;
case 1:
target.val(data[0].label);
target.parent().parent().find('.fish_id').val(data[0].id);
target.parent().parent().find('.quantity').val('');
target.parent().parent().find('.price').val('');
target.parent().parent().find('.item_total').focus();
break;
default:
response( data );
break;
}
}
});
},
select: function (event, ui) {
target.val(ui.item.label); // display the selected text
target.parent().parent().find('.fish_id').val(ui.item.id);
target.parent().parent().find('.quantity').val(ui.item.manufaure_name);
target.parent().parent().find('.price').val(ui.item.model);
target.parent().parent().find('.item_total').val(0);
var keyCode = event.keyCode || event.which;
if (keyCode == 9) {
event.preventDefault(); // stops its action
}
return false;
},
focus: function(event, ui){},
open: function() {},
close: function(event, ui) {
},
});
});
$('body').on('blur', '.autocomplete', function (e) {
target=$(this);
if(target.parent().parent().find('.id').val()==''){
target.val('');
}
});
$('body').on("click", ".btn_new_items" , function() {
error=0;
if(error==0){
var str='';
str+='<tr >';
str+='<td><a href="javascript:void(0)" class="btn_delete" style="display:block;">x</a></td>';
str+=' <td style="width:50%"><div style="position:relative"><span class="clear_product">X</span> </div><input class="form-control title autocomplete" name="title[]"> <input type="hidden" class="fish_id" name="fish_id[]"> </td>';
str+='<td ><input type="text" class="form-control quantity only-numeric" name="quantity[]" style="text-align:right" ></td>';
str+='<td ><input type="text" class="form-control purchase_date datetimepicker" name="purchase_date[]" style="text-align:right" ></td>';
str+='<td ><input type="text" class="form-control price allow_decimal" name="price[]" style="text-align:right"></td>';
str+='<td ><input type="text" class="form-control item_total" name="item_total[]" readonly style="text-align:right" placeholder="0.00"></td>';
str+='</tr>';
$('.item_container').append(str);
//$(this).parent().find('.item_container').append(str);
$('.autocomplete').focus();
}
});
$('body').on("click", ".btn_delete" , function() {
$(this).parent().parent().remove();
updateGrandTotal();
});
$('body').on("keyup", ".quantity , .price" , function() {
var quantity=$(this).parent().parent().find('.quantity').val();
var price=$(this).parent().parent().find('.price').val();
var item_total=0;
if(quantity>0 && price>0){
item_total=parseFloat(quantity)*parseFloat(price);
}
$(this).parent().parent().find('.item_total').val(item_total);
updateGrandTotal();
});
$('body').on("keyup", "#discount_amount" , function() {
updateGrandTotal();
});
function updateGrandTotal(){
var sub_total=0;
var advance_amount=0;
var discount_amount=$('#discount_amount').val();
var grand_total=0;
$('.item_total').each(function(index, obj){
sub_total+=parseFloat(obj.value);
});
grand_total=sub_total;
if(discount_amount>0){
grand_total=grand_total-discount_amount;
}
$('#sub_total').val(sub_total);
$('#grand_total').val(grand_total);
}
]]>
Form data in controller
<![CDATA[
$responseData=[];
if(isset($input['id']) && $input['id']>0){
$this->data['formData']=PurchaseRepository::getOne($input['id']);
$this->data['itemsData']=PurchaseRepository::getItems($input['id']);
//role based
if(empty($this->data['permissions']['generate_invoice'])){
$this->data['block_editing']=1;
}
if($this->data['formData']->status=='despatched'){
unset($this->data['permissions']['invoice']);
unset($this->data['permissions']['despatch']);
$this->data['block_editing']=1;
}
}
else{
$this->data['formData']=new Purchase();
$this->data['formData']->date=date("Y-m-d");
}
]]>
Save function
<![CDATA[
$input['date']=isset($input['date']) ? date('Y-m-d' , strtotime($input['date'])) : '0000-00-00';
//$input['company_id']=$user->company_id;
if(isset($input['id']) && $input['id']>0){
PurchaseDetails::where('purchase_id', $input['id'])->delete();
$object = Purchase::find($input['id']);
$object->update($input);
$message="Successfully updated.";
$input['purchase_id']=$input['id'];
}
else{
$lastBooking=Purchase::orderBy('id','DESC')->first();
$year=date("Y");
if(isset($lastBooking) && $lastBooking->purchase_no!=''){
$bookingNo=explode("/",$lastBooking->purchase_no);
if($year==$bookingNo[1]){
$reg_no=$bookingNo[2]+1;
}
else{
$reg_no=10001;
}
$invoice_no='AJ/'.$year.'/'.$reg_no;
}
else{
$invoice_no='AJ/'.$year.'/10001';
}
$input['purchase_no'] =$invoice_no;
$input['created_by']=$user->id;
$object = Purchase::create($input);
$message="Successfully created.";
$input['purchase_id']=$object->id;
}
if(isset($input['fish_id'])){
foreach($input['fish_id'] as $key=>$val){
$fish= Fish::find($val);
PurchaseDetails::create([
'quantity'=>$input['quantity'][$key],
'price'=>$input['price'][$key],
'purchase_date'=>isset($input['purchase_date'][$key]) ? date('Y-m-d' , strtotime($input['purchase_date'][$key])) : '0000-00-00',
'item_total'=>$input['item_total'][$key],
'fish_id' => $val,
'title' => $fish->fish_name,
'purchase_id'=>$input['purchase_id']
]);
}
}
]]>
MANVIA BLOG