1

我现在正在创建一个这样的复选框集合。

一些背景：起初我只为整个客户端虚拟机使用 ko.mapping 插件。

例如在我的代码上下文中：

self.AllAgencyTypes = ko.mapping.fromJS([]);

self.observables = {   //this would be created by the mapping plugin on render/runtime
    SomeProperty: ko.observable(),
    AgencyTypes: ko.observableArray()
}

我的复选框正确呈现，除了适当的复选框不会在屏幕加载时检查。然后我意识到淘汰赛中的一个问题，我需要将我的选中属性更改为文本。（请参阅我的 get ajax 调用成功）

HTML

<tbody data-bind="foreach: AllAgencyTypes">
 <tr>
   <td>
    <label class="checkbox inline">
       <input  type="checkbox" class="editorField" data-bind="attr: { value: Id }, 
                           checked: $root.SelectedAgencies" />
       <span class="editorField" data-bind="text: Name"></span>
    </label>
  </td>
 </tr>
</tbody>

视图模型

  AgencyDetailsVM: function (options) {

         var self = this;    

         self.AllAgencyTypes = ko.mapping.fromJS([]);

         //added this to get past the check-box bug
         self.SelectedAgencies = ko.observableArray([]); 

         // CRUD Actions
         self.get = function () {
             $.ajax({
                url: options.getURL,
                dataType: 'json',
                success: function (result) {

                    self.observables = ko.mapping.fromJS(result);    

                    //convert to string array
                    self.SelectedAgencies($.Enumerable.From(result.AgencyTypes)
                        .Select(function (x) {
                          return x.Id.toString();
                        }).ToArray()
                    );


                    ko.applyBindings(self, $('form')[0]);
                 }
           });


           $.getJSON(options.getAgencyTypes, function (response) {
                    ko.mapping.fromJS(response, self.AllAgencyTypes);
           });
       };    
 }

我当前的问题是关于保存提交。因为我的复选框绑定到新创建的可观察数组，所以它们没有绑定到我的服务器端模型。

$.ajax({
         url: options.editURL,
         data: self.observables,
         type: "post",
         dataType: "json",    .... 
})

我有一个想法，如果我能够做这样的事情......它可能会解决我的问题......但我不知道如何。（获取 .string 不允许/出现错误 ATM。）

<input  type="checkbox" class="editorField" data-bind="attr: { value: Id }, 
                               checked: $root.observables.AgencyTypes.Id.toString()" />

因此，我看到的唯一选择是将集合推回由 ko.mapping 创建的原始对象中......我现在也不知道该怎么做......有什么想法吗？

4

2 回答 2

1

您正在寻找ko.toJSON一个静态方法，它返回任何具有可观察成员的对象的 JSON 版本！试试这个：

$.ajax({
     url: options.editURL,
     data: ko.toJSON(self.observables),
     type: "post",
     dataType: "json",    .... 
})

如果出于某种原因，您需要一个“普通 JS”而不是序列化的 JSON 字符串，您可以使用它ko.toJSON本身使用的先行函数，ko.toJS：

var plainJSVM = ko.toJS(self.observables); // this produces a JS object containing the current, primitive values of all observables, ready to be serialized as JSON.
于 2012-11-22T16:01:15.797 回答
1

checked绑定需要绑定布尔值或数组，因此您不能直接绑定字符串。

您可以考虑为每个项目添加一个布尔值，并使用计算的 observable来表示所选项目。

否则，您可以使用手动订阅SelectedAgencies来保持AgencyTypes同步。

于 2012-11-22T16:08:21.830 回答