Getting checkbox value from json object

夙愿已清 提交于 2019-12-25 07:47:41

问题


I am currently learning and playing around with the use of the knockout js framework. I have a basic set of fields for contacts. I am able to add contacts without any problems. But I am having difficulties with setting the values for gender male and female. I have declared properly but when reading the JSON object it doesn’t display any values for gender. Why is it not showing if a contact is male or female? JSFIDDLE

var initialData = [{
    firstName: "Jenny",
    lastName: "LaRusso",
    phone: "(555) 121-2121",
    alt_phone: "(555) 123-4567",
    male: false,
    female: true
}, {
    firstName: "Sensei",
    lastName: "Miyagi",
    phone: "(555) 444-2222",
    alt_phone: "(555) 999-1212",
    male: true,
    female: false
}];

var ContactsModel = function (contacts) {
    var self = this;
    self.contacts = ko.observableArray([]);

    ko.utils.arrayForEach(contacts, function (contact) {
        self.contacts.push({
            firstName: contact.firstName,
            lastName: contact.lastName,
            phone: contact.phone,
            alt_phone: contact.alt_phone,
            male: contact.male,
            female: contact.female
        });
    });

    self.addContact = function () {
        self.contacts.push({
            firstName: "",
            lastName: "",
            phone: "",
            alt_phone: "",
            male: false,
            female: false
        });
    };

    self.removeContact = function (contact) {
        self.contacts.remove(contact);
    };

    self.addPhone = function (contact) {
        contact.phones.push({
            number: ""
        });
    };

    self.removePhone = function (phone) {
        $.each(self.contacts(), function () {
            this.phones.remove(phone)
        })
    };

    self.save = function () {
        self.lastSavedJson(JSON.stringify(ko.toJS(self.contacts), null, 2));
    };

    self.lastSavedJson = ko.observable("")
};

ko.applyBindings(new ContactsModel(initialData));

回答1:


To enable a checkbox in knockout.js, the correct syntax is

Declare checkbox in HTML as

<input type='checkbox' data-bind="checked: bindName" />

To Enable/Disable checkbox through knockout.js

<script type="text/javascript">
var viewModel = {
    bindName : ko.observable(false),
};
</script>

Change the javascript code to

ko.utils.arrayForEach(contacts, function (contact) {
    self.contacts.push({
        firstName: contact.firstName,
        lastName: contact.lastName,
        phone: contact.phone,
        alt_phone: contact.alt_phone,
        male: ko.observable(contact.male), /* Line Modified */
        female: ko.observable(contact.female) /* Line Modified */
    });

In HTML Change the code for checkbox

 Male <input type="checkbox" data-bind='checked: male' />
 Female <input type="checkbox" data-bind='checked: female' />

JS Fiddle Link - http://jsfiddle.net/dLbY7/15/



来源:https://stackoverflow.com/questions/22060667/getting-checkbox-value-from-json-object

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!