jqueryオートコンプリートの選択値を取得

Question

私はフォームを持っており、複数のjqueryオートコンプリートを持つことができます。フォームが送信されると、私はオートコンプリートで選択した値を取得し、その値を隠しテキストフィールドにダンプしてサーバーに送信します。私はこれを行う方法に関する情報を見つけることはできないようです。私のコードは以下の通りで、クラ​​スオートコンプリートを使ってすべてのテキストフィールドにバインドします。これに関するアイデア？

$(".autocomplete").autocomplete({ 
      autoFocus: true, 
      source: function(request, response) { 
       $.ajax({ 
        url: "@Url.Action("SearchEmployees", "ProjectBase")", 
        minLength: 3, 
        dataType: "json", 
        type: "GET", 
        data: { term: request.term }, 
        success: function(data) { 
         response($.map(data, function(item) { 
          return { 
           label: item.Fullname, 
           value: item.EmployeeId 
          }; 
         })); 
        }, 
        error: function(xhr, textStatus, errorThrown) { 
         alert("error: " + errorThrown); 
        } 
       }); 
      }, 
      select: function(event, ui) { 
       event.preventDefault(); 
       $(this).val(ui.item.label); 
      }, 
      change: function (event, ui) { 
       alert("change: " + (ui.item ? ui.item.label : "<no item>")); 
      } 
     }); 

Answer 1

あなたはFormData.append()がFormDataオブジェクトへ.autocomplete("instance").selectedItem.label、.valueを追加する.autocomplete要素を、反復するsubmitイベント、.each()を使用することができます。 $.post()FormDataサーバーへのオブジェクト。 instance()

$("form").on("submit", function(e) { 
    e.preventDefault(); 
    var data = new FormData(); 
    $(".autocomplete").each(function(index, selected) { 
    var curr = $(this).autocomplete("instance").selectedItem; 
    data.append(curr.label, curr.value); 
    }); 
    $.post("/path/to/server", data); 
})