knockout.js - 値と選択したテキストの両方を保存する KnockoutJS と Autocomplete

Question

ここにある KnockoutJS Autocomplete コードを使用しています。

オートコンプリート コンボボックスを作成するには?

一般的には問題なく動作しています。オートコンプリートのデータを取得するために JQuery Ajax 呼び出しを使用しています。入力フィールドに入力してリストから値を選択すると、対応する値が Knockout ViewModel に設定されます。ただし、オートコンプリートから選択したテキスト値を設定することはできません。

(これは、部分的な説明が与えられた場合に、SIC 番号を検索できるようにするためです)

私は定義しました：

function Sic(SICCode, SICDescription) {
    var self = this;
    self.SICCode = ko.observable(SICCode);
    self.SICDescription = ko.observable(SICDescription);
}

私のViewModelには次のものがあります：

    self.SICCode = ko.observable("");
    self.SICDescription = ko.observable("");
    self.SicCodes = ko.observableArray();

ルックアップ関数は次のとおりです。

    self.getSicCode = function (searchTerm, sourceArray) {
        $.getJSON(_serviceURL + "/GetSicFromDescription/" + searchTerm, function (data) {
            if (data.length > 0) {
                var result = [];
                $.map(data, function (item) {
                    result.push(new Sic(item.SicCode, item.Description));
                });
                sourceArray(result);
            }
        });
    }

入力タグ (実際には .NET ページです (実際には DotNetNuke カスタム モジュールですが、これは問題ではありません)) には、次のように記述します。

    <div>SIC:<br />
        <input type="text" maxlength="30" 
            data-bind="value: SICDescription, 
            jqAuto: {minLength: 3, autoFocus: true}, jqAutoQuery:getSicCode,
            jqAutoSource: SicCodes, jqAutoSourceLabel: SICDescription, 
            jqAutoValue: SICCode, jqAutoSourceInputValue: 'SICDescription', 
            jqAutoSourceValue: 'SICCode'" />
        <span data-bind="text: SICCode"></span>
    </div>

(値の有無にかかわらず試してみました: バインディング) 入力ボックスに入力すると、ルックアップが正しく実行され、一致するアイテムのリストが表示されます。次に、1 つを選択して、スパン内の対応する番号を確認できます。

ただし、ViewModel データをサーバーに送信するボタンをクリックすると、self.SICDescription() は空です... self.SICCode() には正しい値が含まれています。

では、選択した説明を ViewModel に取り込むにはどうすればよいでしょうか? 入力フィールドに値バインディングを使用すればうまくいくはずだと思いました。しかし、行きません。

とにかく必要なことをする必要がありますか、それとも何らかの回避策を講じる必要がありますか (返された値の配列をループして正しい説明を抜き出します)?

ありがとう。