Level 88
What have you tried so far?
The basic concept here is to fetch all the data you need and return that in an API call. After that you should be able to retrieve this with javascript using that same API.
1 like
I am using local js varriable for appearing data in input box. but i need to reterive these varriables data from mysql Database. that means i will store these data to mysql database and i want reterive data from mysql to "var prices" with same syntax
so please help me to do it
here is my varriable
var prices = [
"Celofen 100 mg Tablet|BOX/PACK|N/A|ACI|4.01",
"Soritec 25 mg Capsule|BOX/PACK|N/A|ACI|85.26",
"Soritec 10 mg Capsule|BOX/PACK|N/A|ACI|45.14",
"Adgar 3 mg/gm Gel|BOX/PACK|N/A|ACI|80.24",
"Adgar 100 mg/100 gm Gel|BOX/PACK|N/A|ACI|60.18",
];
here is my full ajax.js file
//adds extra table rows
var i=$('table tr').length;
$(".addmore").on('click',function(){
html = '<tr>';
html += '<td><input class="case" type="checkbox"/></td>';
html += '<td><input type="text" data-type="productCode" name="pro[]" id="itemNo_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>';
html += '<td><input type="text" data-type="productName" name="name[]" id="itemName_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>';
html += '<td><input type="text" data-type="productGro" name="gro[]" id="itemGro_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>';
html += '<td><input type="text" data-type="productCom" name="com[]" id="itemCom_'+i+'" class="form-control autocomplete_txt" autocomplete="off"></td>';
html += '<td><input type="text" name="price[]" id="price_'+i+'" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td>';
html += '<td><input type="text" name="qty[]" id="quantity_'+i+'" class="form-control changesNo" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td>';
html += '<td><input type="text" name="sub_total[]" id="total_'+i+'" class="form-control totalLinePrice" autocomplete="off" onkeypress="return IsNumeric(event);" ondrop="return false;" onpaste="return false;"></td>';
html += '</tr>';
$('table').append(html);
i++;
});
//to check all checkboxes
$(document).on('change','#check_all',function(){
$('input[class=case]:checkbox').prop("checked", $(this).is(':checked'));
});
//deletes the selected table rows
$(".delete").on('click', function() {
$('.case:checkbox:checked').parents("tr").remove();
$('#check_all').prop("checked", false);
calculateTotal();
});
var prices = [
"Celofen 100 mg Tablet|BOX/PACK|N/A|ACI|4.01",
"Soritec 25 mg Capsule|BOX/PACK|N/A|ACI|85.26",
"Soritec 10 mg Capsule|BOX/PACK|N/A|ACI|45.14",
"Adgar 3 mg/gm Gel|BOX/PACK|N/A|ACI|80.24",
"Adgar 100 mg/100 gm Gel|BOX/PACK|N/A|ACI|60.18",
];
//autocomplete script
$(document).on('focus','.autocomplete_txt',function(){
type = $(this).data('type');
if(type =='productCode' )autoTypeNo=0;
if(type =='productName' )autoTypeNo=1;
if(type =='productGro' )autoTypeNo=2;
if(type =='productCom' )autoTypeNo=3;
$(this).autocomplete({
source: function( request, response ) {
var array = $.map(prices, function (item) {
var code = item.split("|");
return {
label: code[autoTypeNo],
value: code[autoTypeNo],
data : item
}
});
//call the filter here
response($.ui.autocomplete.filter(array, request.term));
},
autoFocus: true,
minLength: 2,
select: function( event, ui ) {
var names = ui.item.data.split("|");
id_arr = $(this).attr('id');
id = id_arr.split("_");
$('#itemNo_'+id[1]).val(names[0]);
$('#itemName_'+id[1]).val(names[1]);
$('#itemGro_'+id[1]).val(names[2]);
$('#itemCom_'+id[1]).val(names[3]);
$('#quantity_'+id[1]).val(1);
$('#price_'+id[1]).val(names[4]);
$('#total_'+id[1]).val( 1*names[4] );
calculateTotal();
}
});
});
//price change
$(document).on('change keyup blur','.changesNo',function(){
id_arr = $(this).attr('id');
id = id_arr.split("_");
qty = $('#quantity_'+id[1]).val();
price = $('#price_'+id[1]).val();
if( qty!='' && price !='' ) $('#total_'+id[1]).val( (parseFloat(price)*parseFloat(qty)).toFixed(2) );
calculateTotal();
});
$(document).on('change keyup blur','#tax',function(){
calculateTotal();
});
//total price calculation
function calculateTotal(){
subTotal = 0 ; sub_total = 0;
$('.totalLinePrice').each(function(){
if($(this).val() != '' )subTotal += parseFloat( $(this).val() );
});
$('#subTotal').val( subTotal.toFixed(2) );
tax = $('#tax').val();
if(tax != '' && typeof(tax) != "undefined" ){
taxAmount = subTotal * ( parseFloat(tax) /100 );
$('#taxAmount').val(taxAmount.toFixed(2));
sub_total = subTotal + taxAmount;
}else{
$('#taxAmount').val(0);
sub_total = subTotal;
}
$('#totalAftertax').val( sub_total.toFixed(2) );
calculateAmountDue();
}
$(document).on('change keyup blur','#amountPaid',function(){
calculateAmountDue();
});
//due amount calculation
function calculateAmountDue(){
amountPaid = $('#amountPaid').val();
sub_total = $('#totalAftertax').val();
if(amountPaid != '' && typeof(amountPaid) != "undefined" ){
amountDue = parseFloat(sub_total) - parseFloat( amountPaid );
$('.amountDue').val( amountDue.toFixed(2) );
}else{
sub_total = parseFloat(sub_total).toFixed(2);
$('.amountDue').val( sub_total);
}
}
//It restrict the non-numbers
var specialKeys = new Array();
specialKeys.push(8,46); //Backspace
function IsNumeric(e) {
var keyCode = e.which ? e.which : e.keyCode;
console.log( keyCode );
var ret = ((keyCode >= 48 && keyCode <= 57) || specialKeys.indexOf(keyCode) != -1);
return ret;
}
//datepicker
$(function () {
$.fn.datepicker.defaults.format = "dd-mm-yyyy";
$('#invoiceDate').datepicker({
startDate: '-3d',
autoclose: true,
clearBtn: true,
todayHighlight: true
});
});
Please or to participate in this conversation.