0

正常に機能するオートコンプリートテキストボックスには、次のものがあります。

 $('#material_number').autocomplete({
     source: function(request, response) {
         $.ajax({
             url: "index.cfm?action=leadtime.getmaterialleadtime&returnformat=json",
             dataType: "json",
             data: {
                 search: request.term,
                 maxRows: 10
             },
             success: function(data) {
                 response(data);
                 console.log();
                 //need to append material_description to a textbox here
             }
         })
     }
 });

私がしようとしているのは、txtMaterialDescriptionというテキストボックスに返されたmaterial_description値を出力することです。このサイトでさまざまな例を見てきましたが、機能させることができません。したがって、ユーザーがオートサジェストリストから部品番号を選択すると、説明フィールドに部品番号の説明が表示されます。誰かが私を助けて正しい方向に私を向けることができますか？

いつものように感謝します。

JC

4

2 に答える 2

3

focusまたはselectイベントをトラップする必要があります。

focus: function(event, ui) {
    $("#textbox").val(ui.item.someProperty);
}

これで、JSONデータが次のようなオブジェクトで構成されている場合は、次のよう{label: ..., value: ..., someProperty: ...}に記述できます。

source: function(request, response) {
    $.ajax({
        url: "index.cfm?action=leadtime.getmaterialleadtime&returnformat=json",
        dataType: "json",
        data: {
            search: request.term,
            maxRows: 10
        },
        success: response
    });
}

それ以外の場合は、次を使用していつでもデータを変換できますjQuery.map。

source: function(request, response) {
    $.ajax({
        url: "index.cfm?action=leadtime.getmaterialleadtime&returnformat=json",
        dataType: "json",
        data: {
            search: request.term,
            maxRows: 10
        },
        success: function(data) {
            response($.map(data, function(item) {
                return {
                    label: item.productName,
                    value: item.productCode,
                    someProperty: item.productDescription + item.productPrice
                }
            }));
        }
    });
}
于 2012-10-30T16:21:24.537 に答える
0

フォーカスオプションを使用して、次のようなフォーカスされたアイテムの詳細を読み込むことができます

   focus: function(event, ui) {
            $(this).val(ui.item.label);

 //do ajax call here  for currently focused element 
  // and on sucesss you can do the following

  //add your detail description here
            $("#tags").empty();
            $("#tags").append("Detailed for "+ui.item.label);

            return false;
        },

詳細な説明については、こちらをご覧ください-jqueryオートコンプリートの例

于 2012-10-30T15:29:53.897 に答える