如何在我的数组中获取更改？答案

【问题标题】：How to get changes in my array?如何在我的数组中获取更改？
【发布时间】：2015-02-19 13:46:24
【问题描述】：

我需要更改我的数组，然后在用户控件中编辑数据。在这个snipet 我的例子中。因为我没有尝试，所以我做不到。我怎样才能做到？

【问题讨论】：

【解决方案1】：

请尝试以下代码 sn-p。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Kendo UI Snippet</title>

    <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1119/styles/kendo.common.min.css">
    <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1119/styles/kendo.rtl.min.css">
    <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1119/styles/kendo.default.min.css">
    <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1119/styles/kendo.dataviz.min.css">
    <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1119/styles/kendo.dataviz.default.min.css">
    <link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1119/styles/kendo.mobile.all.min.css">

    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://cdn.kendostatic.com/2014.3.1119/js/kendo.all.min.js"></script>
    <script src="http://cdn.kendostatic.com/2014.3.1119/js/angular.min.js"></script>
    <script src="http://cdn.kendostatic.com/2014.3.1119/js/jszip.min.js"></script>
</head>
<body>
    <a id="btnShowTest" href="#">Test</a>
    <div id="layout"></div>

    <script>

        var root = {};

        root.data =
        [
            {
                code: 1,
                name: "Test1",
                status: true
            },
            {
                code: 2,
                name: "Test2",
                status: true
            },
            {
                code: 3,
                name: "Test3",
                status: false
            },
        ];

        $(function () {

            $("#btnShowTest").kendoButton().click(function (e) {
                Show();
            });

            root.ds = new kendo.data.DataSource(
            {
                pageSize: 10,
                schema:
                {
                    model:
                    {
                        id: "code",
                        fields:
                        {
                            code:
                            {
                                editable: false,
                                nullable: true
                            },
                            name:
                            {
                                type: "string"
                            },
                            status:
                            {
                                type: "boolean"
                            },
                        }
                    }
                },
                data: root.data
            });

            $("#layout").kendoListView(
            {
                dataSource: root.ds,
                template: kendo.template($("#managersTemplate").html())
            });
        });

        function Show() {
            //root.ds.sync();

            // var arr = root.ds.data();
            var arr = root.data;

            var str = "";

            for (var i = 0; i < arr.length; ++i) {
                str += arr[i].status + ", ";
            }

            alert(str);
        }

        function testclick(obj) {
            var arr = root.data;
            for (var i = 0; i < arr.length; ++i) {
                if (arr[i].code == $(obj).attr('id')) {
                    arr[i].status = $(obj).prop('checked');
                }
            }
        }
    </script>

    <script type="text/x-kendo-tmpl" id="managersTemplate">
        <div >
            <input type="checkbox" data-bind="checked:status"  name="status" id="#:code#" onclick="testclick(this)" />
            <span class="checkbox">#:name#</span>
        </div>
    </script>


</body>
</html>

如果有任何问题，请告诉我。

【讨论】：