淘汰赛 - 链接2下拉菜单

时间:2013-10-08 19:12:58

标签: javascript jquery knockout-2.0

我正在尝试使用淘汰赛填充基于另一个下拉列表的下拉列表,并且它不会太顺利。整个代码在这里:http://jsfiddle.net/UHQUX/3/,在我的机器上它生成前2个下拉列表,但第二个(应该从操作符填充)从未填写。 这些是两个应该连接的下拉列表:

    <td><select data-bind="options: $parent.ColumnNames, value: SearchCriteria(), optionsValue: 'ColumnName', optionsText: 'ColumnDisplayName', optionsCaption: '', attr: { 'id': 'Search_' +Id() + '__ColumnName', name: 'Search[' + Id() + '].ColumnName' }"></select></td>
    <td><select data-bind="options: Operators, optionsValue: 'OpId', optionsText: 'OpName'"></select></td>

这是创建新项目的功能:

 function SearchCriteriaItem(id, searchCriteria, links, operators) {
        var self = this;
        self.Id = ko.observable(id);
        self.SearchCriteria = ko.observable(searchCriteria);

        self.Operators = ko.computed(function() {
            if (self.SearchCriteria() !== null) {
                var opId;
                for (var i = 0; i < links.length; i++) {
                    if (links[i].ColumnName == self.SearchCriteria()) {
                        opId = links[i].OpId;
                    }
                }
                var ops = [];
                for (var j = 0; j < operators.length; j++) {
                    if (operators[j].OpId == opId) {
                        op.push(operators[j]);
                    }
                }
                return ops;
            }
            return [];
        });
    }

这是模型视图:

function SearchCriteriaViewModel() {
var self = this;

var data = [];
var columnNames = [];
data.push({
    ColumnName: 'test1',
    ColumnDisplayName: 'Test 1',
    OpId: '1',
    ColumnValuesId: '1'
});
columnNames.push({
    ColumnName: 'test1',
    ColumnDisplayName: 'Test 1'
});
data.push({
    ColumnName: 'test2',
    ColumnDisplayName: 'Test 2',
    OpId: '2',
    ColumnValuesId: '2'
});
columnNames.push({
    ColumnName: 'test2',
    ColumnDisplayName: 'Test 2'
});
self.Links = data;
self.ColumnNames = columnNames;

var operators = [];
operators.push({
    OpId: '1',
    OpName: 'Test Op'
});

var searchCriteria = [];
self.AvailableSearchItems = searchCriteria;
self.Search = ko.observableArray();

for (var i = 0; i < self.AvailableSearchItems.length; i++) {
    var id = GenerateGuid();
    self.Search.push(new SearchCriteriaItem(id, self.AvailableSearchItems[i], self.Links, operators));
}

self.addSearchCriteria = function () {
    id = GenerateGuid();
    self.Search.push(new SearchCriteriaItem(id, self.AvailableSearchItems[0], self.Links, operators));
};

}

此外,无论我添加多少个搜索条件,ID都始终相同。 id由对控制器的ajax调用生成,该控制器返回新的GUID。返回的值不同,但html显示所有行的相同ID ...

更新:我更新了代码以使其更有意义:http://jsfiddle.net/UHQUX/4/

0 个答案:

没有答案