1
私はいくつかの他の人がスタック上で果たしたことをやろうとしています。私は利用可能なすべての例を試しましたが、これを動作させるように見えません。私は実際の事例をコピーし、変更を反映して、私の場合とまだ、nadaに合っています。Ajaxで複数の入力フィールドにオートコンプリートを行います。
HTMLこのような外観を使用しています。
<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の私は、最後にJSONを扱うためのPHPを
//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();
}
});
});
をデモするために取り組ん源から得ています。
case "fetchAll": {
$query = $db->rawQuery("SELECT itemID, item_name, item_sku FROM items ORDER BY item_name ASC");
if($query) {
$data = array();
foreach($query as $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;
私は常にキャッチされない例外TypeErrorを得る：関係なく、私が使用しているものの例未定義のプロパティ「長さ」を読んでいないことができません。私はjquery 3.0を使ってみましたが、それが問題かもしれないと思っている最新のjquery.uiをダウンロードしました。私はまた、それを確認するために古いバージョンに戻すことを試みました。
私はこの時点で何かが不足していると確信しています。 3日はちょっとばかげているので、私は助けを求めています。スタックにも同様の質問があることは承知しています。私はそれらをすべて試しました。あなたがすべての準備ができていないと思っても、私はjqueryとあまり良くはありません。私は他のすべてを得ることができますも、Ajax呼び出しで動作しますが、これは...
よろしくお願いします。
ありがとうジョエル、私はまだ表示するリストを得ることができないので、私はまだこれにいくつかの問題があります。私はこれと少し遊んで、私が思いつくことができるものを見ます。少なくとも私はその迷惑なエラーはもうありませんので、正しい方向への良い一歩です。私はそれを捕まえたことはないだろう。 – CLHardman
JSONレスポンスを別の構造でエンコードしてみてください。言葉を分離するためにパイプを使用することは、おそらく良いアプローチではありません。続ける... –
私はJSONレスポンスで遊んで、定期的な解析ができるかどうかを確認します。私は今これが働いている。私はdbクエリの中の助けとデータがPHPにどのように渡されるのかを待つ間にいくつかの変更を加えました。これらの変更は失敗します。あなたの評価。 – CLHardman