全选

@{
    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>

 

 

posted on 2014-08-29 21:44  gjcn  阅读(141)  评论(0)    收藏  举报

导航