jquery - テキストボックスのjquery autocomplete:異なる値とテキスト

Question

したがって、この質問は数回出てきましたが、通常は「入力」であり、ほとんどは MVC3 にあります。状況が変わったことを願っています。jquery とオートコンプリートを使用しており、「ラベル」の代わりに「値」を保存したいと考えています。ただし、ユーザーは気にしない主キーの乱数ではなく、意味のあるラベルを見る必要があります。

Web フォームから始めたからかもしれませんが、MVC コントロールがテキストから値を分離するという概念を完全に失っているように見えることに驚いています。問題はおそらく私が何かを見逃していることだと思うほど驚いています。

では、隠しフィールドとモデル プロパティを必要とせずに、値を保存し、選択した項目のラベルをこのテキスト ボックスに表示するにはどうすればよいでしょうか。この場合、ContactName は保存する重要な値です。

かみそり

     @Html.TextBoxFor(x => x.Issue.ContactNameDisplay, new { style = "width: 100%", id = "ContactNameDisplay" })
@Html.HiddenFor(x => x.Issue.ContactName, new {id = "ContactName"})

オートコンプリート:

$('#ContactNameDisplay').autocomplete(
       {
           dataType: 'json',
           source: function (request, response) {
               $.get('@Url.Action("LoadAdFullNames", "Order")', { phrase: request.term }, function (data) {
                   response($.map(data, function (item) {
                       return {
                           label: item.Text,
                           value: item.Value,
                       };
                   }));
               });
           },
           select: function (event, ui) {
               event.preventDefault();
               $('#ContactName').val(ui.item.val);
               $(this).val(ui.item.val);
              $(this).text(ui.item.label);       //Breaks Here
               $.get('@Url.Action("LoadPhoneNumber", "Order")', { windowsId: ui.item.value }, function (data) {
                   $('#ContactPhone').val(data.toString());
               });

           },
           focus: function (event, ui) {
               event.preventDefault();
               $(this).text(ui.item.label);
           },
       });