Knockout JS和Wijmo对话框嵌套绑定

时间:2014-03-26 10:13:50

标签: javascript knockout.js binding viewmodel wijmo

我有这个View-Model结构:

function PluginViewModel(name, code) {
  var self = this;

  self.name = ko.observable(name);
  self.code = ko.observable(code);
}

function item() {
 var self = this;

 self.id = ko.observable();
 self.listIndex = ko.observable();
 self.value = ko.observable();
 self.label = ko.observable();
 self.tabPos = ko.observable();
 self.plugins = ko.observableArray();
};

function TableViewModel() {
var self = this;

self.columns = ko.observableArray();
self.filteredColumns = ko.observableArray();

// To bind View Fields List
self.selectedColumn = ko.observable();
self.selectColumn = function (p) {
    self.selectedColumn(p);
}

// To bind Table Columns List
self.tmpColSelected = ko.observable();
self.tmpColSelect = function (p) {
    self.tmpColSelected(p);
}

// Plugin selected
self.selectedPlugin = ko.observable();
self.selectPlugin = function (p) {
    self.selectedPlugin(p);
}

// New Plugin
self.newPlugin = ko.observable();
self.addPlugin = function () {
    self.selectedColumn().plugins.push(self.newPlugin());

    $('#dialogAddPlugin').wijdialog('close');
}
}

function SchemaViewModel() {
var self = this;

self.name = ko.observable();
self.tables = ko.observableArray();

self.selectedTable = ko.observable();
self.selectTable = function (p) {
    self.selectedTable(p);
}
}

然后这是绑定代码:

schema = new SchemaViewModel();
ko.applyBindings(schema);

有一个Master-Detail场景,其中无序的html列表与tableViewModel的selectedColumn字段绑定。

当选择列表项时,在详细信息视图中,我可以添加带有显示Wijmo对话框的添加按钮的插件。 这是对话代码:

<div id="dialogAddPlugin" title="Plugin editor" data-bind="with: newPlugin">
    <textarea data-bind="value: code, valueUpdate: 'input'"></textarea>
    <div>
        Name: <input data-bind="value: name, valueUpdate: 'input'" />
        <button id="btnSaveNewPlugin" data-bind="click: $parent.addPlugin">Save</button>
    </div>
</div>

问题是即使正确设置了视图模型,也从不调用addPlugin方法。

出了什么问题?

谢谢

0 个答案:

没有答案