TwitterでポストできないBootstrap Typeahead

Question

私はMVC5プロジェクトでTwitter Bootstrap Typeaheadを使用しており、関連するレコードを正しく一覧表示しています。私はupdaterセクションで選択したレコードのId値を取得することはできますが、フォーム送信時に投稿することはできません。 Idパラメータのさまざまな組み合わせを試しましたが、意味がありませんでした。 Twitter Bootstrap TypeaheadでIdパラメータを投稿するには？

ビュー：

@Html.HiddenFor(m => m.StudentId) 

<input id="StudentId" name="StudentId" type="text" class="form-control tt-input" 
    autocomplete="off" spellcheck="false" dir="auto"> 

<script> 
    $("#StudentId").typeahead({ 
     minLength: 1, 
     source: function (query, process) { 
      var lookups = []; 
      map = {}; 

      // This is going to make an HTTP post request to the controller 
      return $.post('/Grade/StudentLookup?query=%QUERY', { query: query }, function (data) { 

       // Loop through and push to the array 
       $.each(data, function (i, lookup) { 
        map[lookup.Name] = lookup; 
        lookups.push(lookup.Name); 
       }); 

       // Process the details 
       process(lookups); 
      }); 
     }, 
     updater: function (item) { 
      var selectedId = map[item].Id; 
      console.log("Selected : " + selectedId); 
      return item; 
     } 
    }); 
</script> 

コントローラ：名前とIDに

public ActionResult StudentLookup(string query) 
{ 
    var students = repository.Students.Select(m => new StudentViewModel 
    { 
     Id = m.Id, 
     Name = m.Name + " " + m.Surname     
    }) 
    .Where(m => m.Name.StartsWith(query)); 
    return Json(students, JsonRequestBehavior.AllowGet); 
} 

Answer 1

洗面所独立フィールドは、あなたも、IDフィールドが非表示または読み取り専用にすることができます。

<input id="StudentName" type="text" class="form-control tt-input" 
    autocomplete="off" spellcheck="false" dir="auto"> 

<input id="StudentId" name="StudentId" type="text"> 

<script> 
    $("#StudentName").typeahead({ 
     minLength: 1, 
     source: function (query, process) { 
      var lookups = []; 
      map = {}; 

      // This is going to make an HTTP post request to the controller 
      return $.post('/Grade/StudentLookup?query=%QUERY', { query: query }, function (data) { 

       // Loop through and push to the array 
       $.each(data, function (i, lookup) { 
        map[lookup.Name] = lookup; 
        lookups.push(lookup.Name); 
       }); 

       // Process the details 
       process(lookups); 
      }); 
     }, 
     updater: function (item) { 
      var selectedId = map[item].Id; 
      console.log("Selected : " + selectedId); 
      $("#StudentId").val(selectedId) 
      return item; 
     } 
    }); 
</script>