2

My View はモデルにバインドされ、いくつかのドロップダウン リストが表示されます。それらの数とオプションは、モデルのいくつかのプロパティに基づいています。

ノックアウト js を使用して、ドロップダウン リストの選択した各値を監視可能な配列にデータ バインドし、どの値がどの ddl に属しているかを追跡したいと考えています。

各ドロップダウン リストは、次のコードを使用して表示されます。

@for (var i = 0; i < Model.ProductProfiles.Count; i++)
        {
            var productProfile = Model.ProductProfiles[i];
            if (productProfile.IsVarying)
            {
                var lastItem = 0;           
                <div class="tab-pane" id="@productProfile.Name">                        
                    @for (var j = 0; j < productProfile.Attributes.Count; j++)
                    {           

                        <text>@productProfile.Attributes[j].Name</text>                                                     
                        @Html.DropDownListFor(m => m.ProductProfiles[i].SelectedValues[j], (SelectList)ViewData["Levels_" + i + "_" + j],
                        new { @class = "ddl-levels" })
                        <br />
                    }
                </div>
            }
        }

ドロップダウンリストが正しく入力され、デフォルト値が正しく設定されています (ViewData で渡されたモデルと選択リストの両方を使用)。

次のような配列にデータバインドする方法はありますか:

array[0]["0", "1", "3", "1",....] ここで、array[0] は Model.ProductProfiles[0] を参照し、配列の 2 番目の次元は選択された値を保持しますforループに表示されるddlの場合?

ビューモデルを次のように単純に設定してみました

var viewModel = {
    selectedValues: ko.observableArray([])              
};

そして必死になって、データバインド値を変更して、監視可能な配列の位置アクセスをシミュレートしようとしました。

@Html.DropDownListFor(m => m.ProductProfiles[i].SelectedValues[j], (SelectList)ViewData["Levels_" + i + "_" + j],
                        new { @class = "ddl-levels", data_bind = "value: productProfiles([" + i + "][" + j + "])" })

残念ながらうまくいきませんでした...

はっきりしていればよかったと思います。私を助けてくれる人はいますか?

ありがとう

編集:コメントのアドバイスに基づいて、多次元配列を次のような3つの監視可能な配列に分割しました:

var viewModel = {        
    selectedValuesProd0: ko.observableArray(),
    selectedValuesProd1: ko.observableArray(),
    selectedValuesProd2: ko.observableArray()
}

次に、HTMLコードを変更しました

var observableArrayProduct = "selectedValuesProd0";
                    if (i == 1)
                    {
                        observableArrayProduct = "selectedValuesProd1";
                    }
                    else if (i == 2)
                    {
                        observableArrayProduct = "selectedValuesProd2";
                    }

@Html.DropDownListFor(m => m.ProductProfiles[i].SelectedValues[j], (SelectList)ViewData["Levels_" + i + "_" + j], new { @class = "ddl-levels", data_bind = "value: " + observableArrayProduct + "()[" + j+ "]" })

ご覧のとおり、私はまだ一次元の監視可能な配列への位置アクセスを試みていますが、ユーザーがドロップダウン リストで何かを変更したときに、選択された値を追跡していません。

この時点で、位置アクセスが機能しないと思い始めていますが、そうである場合、他に何ができますか?

編集2:解決しました!

わかりました、重要なステップがありませんでした: 観測可能な配列の各項目はそれ自体が観測可能な値であるため、次のように修正しました。

var viewModel = {        
    selectedValuesProd0: ko.observableArray(ko.utils.arrayMap(selectedValuesPerProduct[0], function(item) {
        return ko.observable(item);
    })),
    selectedValuesProd1: ko.observableArray(ko.utils.arrayMap(selectedValuesPerProduct[1], function(item) {
        return ko.observable(item);
    })),
    selectedValuesProd2: ko.observableArray(ko.utils.arrayMap(selectedValuesPerProduct[2], function(item) {
        return ko.observable(item);
    }))
}

selectedValuesPerProduct は、サーバー側のコードからビューに (シリアル化後に) 渡されたモデルを使用して構築された 2 次元配列です。

これが役立つことを願っています!

4

2 に答える 2

0

この質問を閉じたことがないことに気付いたので、ここに回答を追加します。

わかりました。重要なステップがありませんでした。監視可能な配列の各項目自体が監視可能な値であるため、次のように修正しました。

var viewModel = {        
selectedValuesProd0: ko.observableArray(ko.utils.arrayMap(selectedValuesPerProduct[0], function(item) {
    return ko.observable(item);
})),
selectedValuesProd1: ko.observableArray(ko.utils.arrayMap(selectedValuesPerProduct[1], function(item) {
    return ko.observable(item);
})),
selectedValuesProd2: ko.observableArray(ko.utils.arrayMap(selectedValuesPerProduct[2], function(item) {
    return ko.observable(item);
}))

}

ここで、selectedValuesPerProductは、サーバー側のコードからビューに渡されたモデルを使用して構築された2次元配列です(シリアル化後)。

于 2012-05-15T11:42:01.683 に答える
0

次のようにドロップダウンを渡すことをお勧めします: {firstArray: [1,2,3], secondArray: [4,5,6]}

基本的に、代わりに提案する方法で作業を保存することはありません。インデクサーと同じように、'firstArray' と 'secondArray' を人間に優しくないものにすることができます。なぜそれが価値のある目標になるのかはわかりませんが;)私はできる限り保守可能なコードを追求しています. あなたの後にやってきてマルチレベルのインデクサーを見た人は、あなたの賢さを評価したり、後で頭を悩ませたりすることはありません。

于 2012-05-14T14:32:40.053 に答える