全选
@{ ViewBag.Title = "Home Page"; Html.RenderPartial("~/Views/Home/ViewPage1.cshtml"); } <div > <button data-bind="click: incrementClickCounter">Click me</button> </div> <script> function ViewModel() { var self = this; //self.students = ko.observableArray([]); //添加动态监视数组对象 self.students = ko.mapping.fromJS([]); self.incrementClickCounter = function () { $("#selctor").show(); }; self.students.subscribe(function () { ko.utils.arrayForEach(self.students(), function (container1) { ko.utils.arrayForEach(container1.lnames(), function (container) { container.ischeck = ko.computed({ read: function () { var allReceived = true; ko.utils.arrayForEach(container.names(), function (content) { if (!content.ischeck()) { allReceived = false; } }); return allReceived; }, write: function (value) { // alert("ss"); ko.utils.arrayForEach(container.names(), function (content) { content.ischeck(value); }); } }); }); }); }); self.LoadData = function () { $.getJSON("/Home/GetTest5", {}, function (data1) { // self.students(data1); ko.mapping.fromJS(data1, self.students); }); }; self.Count = ko.computed(function () { return self.students().length; }); self.LoadData(); } $(document).ready(function () { var vm = new ViewModel(); ko.applyBindings(vm); }); </script>
public JsonResult GetTest5() { List<dynamic> list1 = new List<dynamic>() { new { ename="guo", ischeck = false, }, new { ename="jun", ischeck = false, }, new { ename="guojun", ischeck = false, } }; List<dynamic> list3 = new List<dynamic>() { new { ename="guo", ischeck = false, }, new { ename="jun", ischeck = false, }, }; List<dynamic> list2 = new List<dynamic>() { new { mname="guo1", ischeck = false, names = list1 }, //new { //mname="guo2", //ischeck = false, //names = list3 //}, }; List<dynamic> list = new List<dynamic>() { new { lname="iori", lnames = list2 }, //new { // lname="iori1", // ischeck = false, // names = list2 //}, }; return Json(list, JsonRequestBehavior.AllowGet); }
<div style="display:none;margin:400px 200px;" id="selctor"> <div data-bind='foreach: students'> <div> @* <input type="checkbox" data-bind="checked: ischeck" />*@ <span data-bind="text: lname"> </span> </div> <div data-bind='foreach: lnames'> <div> <input type="checkbox" data-bind="checked: ischeck" /> <span data-bind="text: mname"></span> </div> <div data-bind='foreach: names'> <div style="float: left"> <input type="checkbox" data-bind="checked: ischeck" /> <span data-bind="text: ename"></span> </div> </div> </div> </div> </div>
版权所有归"布衣软件工作者".未经容许不得转载.
浙公网安备 33010602011771号