Question

我需要在数组中进行更改，然后在用户控件中编辑数据。在这个snipet我的例子中。因为我没有尝试，我不能这样做。我怎么能成功呢？

Answer 1

请尝试使用以下代码段。

<!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>

如果有任何疑虑，请告诉我。

如何更改我的数组？

1 个答案: