i trying several other people have accomplished here on stack. have tried of examples available , cannot seem work. i've copied working examples , reflected changes match case , still, nada.
html using looks this.
<tr> <td><a id="remrow"><span class="icon icon-squared-cross"></span></a></td> <td><input type="hidden" data-type="itemid" name="itemid[]" id="itemid" class="form-control autocomplete_txt" autocomplete="off"> <input type="text" data-type="item_name" name="item_name[]" id="item_name" class="form-control autocomplete_txt" autocomplete="off" placeholder="item name"></td> <td><input type="text" name="item_sku[]" id="item_sku" class="form-control changesno" autocomplete="off" onkeypress="return isnumeric(event);" ondrop="return false;" onpaste="return false;" placeholder="sku#"></td> <td><input type="text" name="item_qty[]" id="item_qty" class="form-control changesno" autocomplete="off" onkeypress="return isnumeric(event);" ondrop="return false;" onpaste="return false;" placeholder="qty"></td> <td><input type="text" name="item_rate[]" id="item_rate" class="form-control changesno" autocomplete="off" onkeypress="return isnumeric(event);" ondrop="return false;" onpaste="return false;" placeholder="cost"></td> <td><input type="text" name="balance[]" id="balance" class="form-control totallineprice" autocomplete="off" onkeypress="return isnumeric(event);" ondrop="return false;" onpaste="return false;" placeholder="balance"></td> </tr>
jquery i've gotten working source demo
//autocomplete script $(".autocomplete_txt").keyup(function(){ type = $(this).data('type'); if(type =='itemid' )autotypeno=0; if(type =='item_name' )autotypeno=1; $(this).autocomplete({ source: function( request, response ) { $.ajax({ url : 'ajax.php', datatype: "json", method: 'post', data: { name_startswith: request.term, type: type }, success: function( data ) { response( $.map( data, function( item ) { var code = item.split("|"); return { label: code[autotypeno], value: code[autotypeno], data : item } })); } }); }, autofocus: true, minlength: 0, select: function( event, ui ) { var names = ui.item.data.split("|"); id_arr = $(this).attr('id'); id = id_arr.split("_"); element_id = id[id.length-1]; $('#itemid_'+element_id).val(names[0]); $('#item_name_'+element_id).val(names[1]); /*$('#quantity_'+element_id).val(1); $('#price_'+element_id).val(names[2]); $('#total_'+element_id).val( 1*names[2] );*/ calculatetotal(); } }); });
lastly, php handle json.
case "fetchall": { $query = $db->rawquery("select itemid, item_name, item_sku items order item_name asc"); if($query) { $data = array(); foreach($query $key => $val) { //echo $val['itemid']; $name = $val['itemid'].'|'.$val['item_name'].'|'.$val['item_sku']; array_push($data, $name); } echo json_encode($out); } else { echo "error"; } } break;
i uncaught typeerror: cannot read property 'length' of undefined no matter example use. i've tried using jquery 3.0, , downloaded latest jquery.ui thinking that may problem. i've tried reverting older versions check that.
i convinced @ point missing something. 3 days bit ridiculous asking help. know there similar questions on stack , yes, have tried them all. if you've not ready guessed not jquery. can else work ajax calls, but, this...
regards.
clhardman:
try use following script inclusion in head section:
html file:
<head> <script src='http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.8.2.min.js'></script> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script> <script> $( document ).ready(function() { //autocomplete script $(".autocomplete_txt").keyup(function(){ type = $(this).data('type'); if(type =='productcode' )autotypeno=0; if(type =='productname' )autotypeno=1; $(this).autocomplete({ source: function( request, response ) { $.ajax({ url : 'ajax.php', datatype: "json", method: 'post', data: { name_startswith: request.term, type: type }, success: function( data ) { response( $.map( data, function( item ) { var code = item.split("|"); return { label: code[autotypeno], value: code[autotypeno], data : item } })); } }); }, autofocus: true, minlength: 0, select: function( event, ui ) { var names = ui.item.data.split("|"); id_arr = $(this).attr('id'); id = id_arr.split("_"); element_id = id[id.length-1]; $('#itemid_'+element_id).val(names[0]); $('#item_name_'+element_id).val(names[1]); /*$('#quantity_'+element_id).val(1); $('#price_'+element_id).val(names[2]); $('#total_'+element_id).val( 1*names[2] );*/ calculatetotal(); } }); }); }); </script> </head>
i couldn't replicate scenario, seems have conflicts jquery scripts. hope helps...
Comments
Post a Comment