Question

我是KnockoutJS的新手，我用dropdownlist做了简单的事情，填充和使用静态数据但是现在需要动态地执行两个事情下拉列表

1.想要动态填充下拉列表（比如任何列表），我们可以从我的控制器获取此列表。

    SwipeRefreshLayout swipeRefreshLayout = (SwipeRefreshLayout)findViewById(R.id.your_id_for_swiperefreshlayout);
    swipeRefreshLayout.setOnRefreshListener(this);
    @Override
    public void onRefresh() {
        //reload the data
    }

尝试动态填充下拉列表，成功从控制器获取json数据但数据未填充。

Answer 1

您需要在此处解决各种问题。你应该把obj作为一个功能。 2.您需要创建其对象，然后在ko.applyBindings中使用该对象。 3.你没有宣布totalVal

您的代码应与此jsFiddle中的代码类似（请注意，我已对您的ajax调用进行了评论。您可以将其重新启用）

<强>使用Javascript：

var InsertVal = function (name, id) {
    this.pname = name;
    this.pid = id;
};

var Valuess = function () {
    var totalval = [];

    data = [{parentCategoryName : 'Parent1', parentCategoryId: 1},
           {parentCategoryName : 'Parent2', parentCategoryId: 2},
           {parentCategoryName : 'Parent3', parentCategoryId: 3}];

    for (i = 0; i < data.length; i++) {
                totalval.push(new InsertVal(data[i].parentCategoryName, data[i].parentCategoryId));
            }


    /*$.ajax({
        dataType: "json",
        url: "getParentCategory.do",
        success: function (data) {
            for (i = 0; i < data.length; i++) {
                totalval.push(new InsertVal(data[i].parentCategoryName, data[i].parentCategoryId));
            }
        }
    });*/

    return totalval;
}


var objViewModel = function() {
    var self = this;
    console.log(Valuess());
    self.parentCategory = ko.observableArray(Valuess());
    self.chosenParentCategory = ko.observableArray();
};

var obj = new objViewModel();
ko.applyBindings(obj);

<强> HTML

<p>
    <select data-bind="options: parentCategory,
              optionsText: 'pname',
            value: chosenParentCategory,
            optionsCaption: 'Choose...'"></select>
</p>
<div data-bind="visible: chosenParentCategory">You have chosen a Parent Category <span data-bind="text: chosenParentCategory() ?
 chosenParentCategory().pid : '0'"></span>.</div>

Answer 2

评论者是正确的，documentation存在以指导您完成此操作，但这是一个基本的（阅读：不完整和不完美）fiddle，以帮助您入门：

<select data-bind="options: Object.keys(viewModel.cars), optionsCaption: 'Select Make', value: make"></select>
<select data-bind="options: modelOptions, optionsCaption: 'Select Model', value: model"></select>

var viewModel = new (function() {
    var self = this;
    this.cars = {
        'Chevy': ['Camaro', 'Spark'],
        'Honda': ['Civic', 'Insight'],
        'Tesla': ['Model S', 'Model X']
    };

    this.make = ko.observable();
    this.model = ko.observable();
    this.makeOptions = Object.keys(this.cars);
    this.modelOptions = ko.computed(function() {
        return this.cars[this.make()];
    }, this);
})();

ko.applyBindings(viewModel);

http://jsfiddle.net/3ec7gocc/

KnockoutJS：动态填充下拉列表

2 个答案: