0

私はこのような配列を持っています - NOTE "Options" array does not include[ ]; これは、MVC を介してサーバーから返されるデータです。元々、以下のコメント付きコードのようにこの配列を取得します。

//var initialData = @Html.Raw(Json.Encode(Model.FieldList));):

var initialData = [{ "DisplayName": "Service Status",
"Options": { "123": "Active", "127": "Scrapped", "121": "Inactive" },
"Value": "123"
        }];

Options の値を、「Active」、「Scrapped」、「Inactive」というラベルの付いたドロップダウンに入れたいと思います。各マップは、配列 Options にリストされているそれぞれの数値にマップされます。

そのドロップダウンで、123 に対応する値「アクティブ」を事前に選択したいと考えています。ドロップダウンのラベルは「サービス ステータス」になります。

これは私がこれまでに持っているコードです。しかし、1 つの要素 Active を含む Service Status ドロップダウンのみが表示されます。他の 2 つの要素をドロップダウンに追加するにはどうすればよいですか?

これについて私を助けていただければ、とても感謝しています。ありがとう！

<script type="text/javascript">
    var viewModel;
    $(document).ready(function() {
           var initialData = [{ "DisplayName": "Service Status",
                  "Options": { "123": "Active", "127": "Scrapped", "121": "Inactive" },
                  "Value": "123"
           }];
        viewModel = { fields: ko.observableArray(initialData) };
        ko.applyBindings(viewModel);
    });
</script>

<span data-bind="foreach: viewModel.fields">
<span data-bind="text:DisplayName"></span>
<select data-bind="options: Options,                                
                         optionsValue: Value"></select>
</span>
4

1 に答える 1

0

値を含むオブジェクトを、オプション バインディングで使用できる配列にマップする必要があります。

何かのようなもの：

var optionsFromServer = data[0].Options,
    options = [];

for (var prop in optionsFromServer) {
    if (optionsFromServer.hasOwnProperty(prop)) {
        options.push({ id: prop, text: optionsFromServer[prop] });   
    }
}

次に、次のように、この新しいオプション配列に対してバインドできます。

<select data-bind="options: options, optionsValue: 'id', optionsText: 'text'"></select>
于 2013-03-15T16:55:25.007 に答える