AJAX を使用した jQuery オートコンプリート - 何が足りないのでしょうか? - TechRepublic

質問

• 

  AJAX を使用した jQuery AutoComplete – 何が欠けているのでしょうか?

  私は、シンプルなテスト ページ (AJAX 部分が動作したら拡張する予定です) のクライアント/顧客選択入力フィールドに jQuery AutoComplete を使用しようとしています。

  https://jqueryui.com/autocomplete/#remote-jsonp から JQuery サンプル JavaScript を（逐語的に）コピーしました。これに対して行った唯一の変更は、”#…” ID 名と “source” 定義の URL 値です。

  バックエンドサーバー（Django を実行）は JavaScript からのリクエストを正常に受信し、JSON コールバック文字列を正しく生成しているようです。出力は以下のとおりです。U
  :\>curl http://localhost:51181/AjaxClientAutocomplete/?term=adm
  [ {label: “ADMAC”, value: “109”}, {label: “Administration Software L”, value: “110”}, {label: “Adminsoft – Office Rental”, value: “111”}, {label: “Adminsoft – Reimburse Int”, value: “112”}, {label: “Adminsoft – Royalties”, value: “113”}, {label: “adminsoftware.biz”, value: “114”}, {label: “Admiral Word Publishing B”, value: “115”} ]

  ブラウザの開発者ツールを使って、DOMが認識するHTMLをハードドライブ上のテストHTMLファイルにコピーしました。これを必要最低限​​に絞り込み、いくつかのバリエーションを作成して、何が機能し、何が機能しないかをテストしました。

  ローカル変数をオートコンプリートの「ソース」として使用すると、正常に動作します。これには、上記に示した完全な文字列 (JavaScript にコピーして貼り付け) のようにオブジェクトの配列である場合も含まれます。

  つまり、JavaScript（下記参照）はサーバーにリクエストを送信しているように見えますが、サーバーはこれを受信し、応答しています。どうやら正しいJSONレスポンスのようです。JavaScriptはこれを処理してソースラベル/値リストを更新していないようです。そのため、ソースが同じリストを持つ変数である場合と同じように、これを使用できます。

  この技術分野にはまだ慣れていないので、他に試すべきことが思いつきません。何か見落としている点がお分かりの方はいらっしゃいますか？JavaScriptは以下のとおりです。

  $(関数() {

  $(“#idClientName”).autocomplete({
  source: function (request, response) {
  $.ajax({
  url: “/AjaxClientAutocomplete/”,
  dataType: “jsonp”,
  data: {
  term: request.term
  },
  success: function (data) {
  response(data);
  }
  });
  },
  minLength: 2,
  });
  });

  PS: 2500 文字の制限のため、「ログ」コンポーネントを削除しました。

すべての答え