0

我正在使用不同类型的控件 ( http://jsfiddle.net/gZC5k/993/ ) 的嵌套表单，该表单在添加下拉控件时出现问题。

我的 HTML 中有这个

                        <tr class='person'>
                        <td>Gender</td>
                        <td>
                            <select data-bind="options: optionGender, value: gender"></select>
                        </td>
                    </tr>

这在模型中

    self.contacts = ko.observableArray(ko.utils.arrayMap(contacts, function (contact) {
    return {
        firstName: ko.observable(contact.firstName),
        lastName: ko.observable(contact.lastName),
        isKey: ko.observable(contact.isKey),
        gender: ko.observable(contact.gender),
        phones: ko.observableArray(ko.utils.arrayMap(contact.phones, function (phone) {
            return {
                type: ko.observable(phone.type),
                number: ko.observable(phone.number),
                calls: ko.observableArray(phone.calls)
            };
        })),
        addresses: ko.observableArray(contact.addresses),
        optionGender: ["Male", "Female"]
    };
}));

self.addContact = function () {
    self.contacts.push({
        firstName: "",
        lastName: "",
        isKey: "false",
        gender: "Female",
        phones: ko.observableArray(),
        addresses: ko.observableArray()
    });
};

当我最初加载数据时，我可以编辑所有值并且相应的 JSON 是好的当添加一个新的人时，事情出错了。

当所有与 Gender 字段相关的东西都被删除时，表单就可以正常工作（参见http://jsfiddle.net/gZC5k/995/）。我认为我是把

            optionGender: ["Male", "Female"],

在错误的地方，但无法弄清楚它应该在哪里。

4

1 回答 1

0

以为我通过在 addContact 函数中重复 optionGender 找到它（在http://jsfiddle.net/gZC5k/997/）

var optionGender = [
"Male",
"Female"];

var ContactsModel = function (contacts) {
var self = this;
self.contacts = ko.observableArray(ko.utils.arrayMap(contacts, function (contact) {
    return {
        firstName: ko.observable(contact.firstName),
        lastName: ko.observable(contact.lastName),
        isKey: ko.observable(contact.isKey),
        gender: ko.observable(contact.gender),
        phones: ko.observableArray(ko.utils.arrayMap(contact.phones, function (phone) {
            return {
                type: ko.observable(phone.type),
                number: ko.observable(phone.number),
                calls: ko.observableArray(phone.calls)
            };
        })),
        addresses: ko.observableArray(contact.addresses),
        optionGender: optionGender,
    };
}));

self.addContact = function () {
    self.contacts.push({
        firstName: ko.observable(""),
        lastName: ko.observable(""),
        isKey: ko.observable("true"),
        gender: ko.observable("Female"),
        optionGender: optionGender,
        phones: ko.observableArray(),
        addresses: ko.observableArray()
    });
};

但这会导致在结果 JSON 中有选项列表，就像这样

[
{
"firstName": "",
"lastName": "",
"isKey": "true",
"gender": "Male",
"optionGender": [
  "Male",
  "Female"
],
"phones": [],
"addresses": []
},
{
"firstName": "",
"lastName": "",
"isKey": "true",
"gender": "Female",
"optionGender": [
  "Male",
  "Female"
],
"phones": [],
"addresses": []
}
]

所以我还在寻找解决方案..

于 2013-02-25T22:33:42.313 回答