使用Knockout以编程方式更改选项值

时间:2013-11-11 08:52:00

标签: javascript jquery ajax knockout.js

我有一个与淘汰赛绑定的选项,如下所示:

<select id="ddlProducts" data-bind="options: ShowProducts, optionsText: 'pruductskuname', optionsCaption: 'Choose a product...', value: currentproduct"></select>

我有一个ajax调用,用于验证序列号并返回产品名称。我想将选定的选项更改为退货产品。我的ajax调用返回的是产品名称:pruductskuname

有没有办法根据我的回报设置所选选项?

例如,如果我的Return == ProductA返回我想在我的选项ProductA中找到并将值设置为ProductA。

这是我的VM:

    /* Data View Model */
    var myDataViewModel = {
        products: ko.observableArray(),
        viewserialized: ko.observable(1),
        currentordernumer: ko.observable(),
        currentserialqty: ko.observable(),
        currentproduct: ko.observable(),
        dataitems: ko.observableArray()
    };

这是我的ajax调用,它获取了返回消息:

 $.ajax({
                url: "ServiceURL",
                data: { Serial: ko.toJS(myDataViewModel.currentserialqty) },
                type: "GET",
                contentType: "application/json; charset=utf-8",
                dataType: "JSON",
                timeout: 10000,
                success: function (Result) {
                   /*SET OPTION BINDING HERE BASED ON Result.d */
                    alert(Result.d);
                },
                error: function (xhr, status) {
                    alert(status + " - " + xhr.responseText);
                }
            });

1 个答案:

答案 0 :(得分:1)

有两种方法可以做到这一点,一种方法是将optionsValue设置为pruductskuname,如下所示:

 <select id="ddlProducts" data-bind="options: ShowProducts, optionsText: 'pruductskuname', optionsCaption: 'Choose a product...', value: currentproduct", optionsValue: 'pruductskuname'></select>

这将使currentproduct等于产品名称,因此您在成功回调中所需要做的就是myDataViewModel.currentproduct(Result.d);

如果你不这样做,你可以

  myDataViewModel.currentproduct(ko.utils.arrayFirst(myDataViewModel.products(), function (item)
    {
        return item.pruductskuname() === Result.d;  //note the ()
    })

将搜索具有该名称的项目并将其设置为当前产品。