2013-04-27 65 views
0

我面临使用knockout.js数据绑定复选框的问题。 的的jsfiddle http://jsfiddle.net/sajesh1985/ypbLN/复选框数据绑定使用knockout.js和jquery移动

(HTML)代码:

<h2>View1</h2> 
<h4>Select Columns:</h4> 
<ul data-bind="foreach: gridOptions.columns" data-role="listview"> 
<div data-role="fieldcontain" > 
<li id="li">  
    <label> 
     <input type="checkbox" id="chk" data-bind="event: {change: function(){ checked(!checked()); } }, checkbox: checked" /> <span data-bind="text: header"></span> 
    </label> 
</li> 
</div> 
</ul> 
<hr> 
<table> 
<thead> 
    <tr data-bind="foreach: gridOptions.columns"> 
     <th data-bind="visible:checked, text: header"></th> 
    </tr> 
</thead> 
<tbody data-bind="foreach: people"> 
    <tr data-bind="foreach: $parent.gridOptions.columns"> 
     <td data-bind="text: $parent[dataMember], visible:checked"></td> 
    </tr> 
</tbody> 
</table> 

JS代码:

var ProductSearchViewModel = { 

gridOptions: { 
    columns: [{ 
     header: 'First Name', 
     dataMember: 'firstName', 
     checked: ko.observable(true) 
    }, { 
     header: 'Last Name', 
     dataMember: 'lastName', 
     checked: ko.observable(true) 
    }] 
}, 

people: [{ 
    firstName: 'Bert', 
    lastName: 'Bertington' 
}, { 
    firstName: 'Charles', 
    lastName: 'Charlesforth' 
}, { 
    firstName: 'Denise', 
    lastName: 'Dentiste' 
}] 


}; 

ko.bindingHandlers.checkbox = { 
update: function (element, valueAccessor) { 

    var value = valueAccessor(); 

    var valueUnwrapped = ko.utils.unwrapObservable(value); 

    //$(element).checkboxradio().trigger('create');    
    $(element).attr("checked", valueUnwrapped).checkboxradio("refresh"); 

} 
}; 

$(document).ready(function() { 
ko.applyBindings(ProductSearchViewModel);  
}); 

能否请你帮我整顿的问题? 我正在越狱未能在初始化之前调用checkboxradio上的方法;试图在浏览器中调用方法'刷新'。

+0

这是很难给你没有你的代码在这里发布的解决方案。从错误中,您可以在创建复选框之前触发(刷新)或更改其属性。 – Omar 2013-04-27 09:11:35

回答

0

绑定复选框的最佳方法是使用检查结合喜欢这里:

<input type="checkbox" id="chk" data-bind="checked: checked" /> 

参见文档:http://knockoutjs.com/documentation/checked-binding.html

+0

同意,但这有一个与jQuery手机自定义复选框的问题 – 2013-04-28 09:58:58