Question

我有一个Treeview。在选择treenode的编辑时，将显示角色的剑道网格和少量文本框（其中编辑角色的其他属性）。角色的kendo网格有复选框和Rolenames。如果我选中一个复选框，我当前的代码就可以了。

如果我检查多个复选框，我需要的是如何获取角色的ID数组。尝试了多种方式，但是当选择多个复选框时，我没有获得ID列表。点击编辑节点时，EditNode会被触发，点击保存后，“点击”就会被触发。

以下是我的代码：

function editNode(itemid) {
var editTemplate = kendo.template($("#editTemplate").html());
var treeview = $("#treeview").data("kendoTreeView");
var selectedNode = treeview.select();
var node = treeview.dataItem(selectedNode);

$("<div/>")
    .html(editTemplate({ node: node }))
    .appendTo("body")
    .kendoWindow({
        title: "Node Details",
        modal: true,
        open: function () {
            console.log('window opened..');
            editDS = new kendo.data.DataSource({
                schema: {
                    data: function (response) {
                        return JSON.parse(response.d); // ASMX services return JSON in the following format { "d": <result> }. 
                    },
                    model: {// define the model of the data source. Required for validation and property types.
                        id: "Id",
                        fields: {
                            Id: { editable: false, nullable: false, type: "string" },
                            name: { editable: true, nullable: true, type: "string" },
                            NodeId: { editable: false, nullable: false, type: "string" },
                        }
                    },
                },
                transport: {
                    read: {
                        url: "/Services/MenuServices.asmx/getroles",
                        contentType: "application/json; charset=utf-8", // tells the web service to serialize JSON
                        type: "POST", //use HTTP POST request as the default GET is not allowed for ASMX
                        datatype: "json",
                    },
                }
            });

            rolesGrid = $("#kgrid").kendoGrid({
                dataSource: editDS,
                height: 150,
                pageable: false,
                sortable: true,
                binding: true,
                columns: [
                       {
                           field: "name",
                           title: "Rolename",
                           headerTemplate: '<span class="tbl-hdr">Rolename</span>',
                           attributes: {
                               style: "vertical-align: top; text-align: left; font-weight:bold; font-size: 12px"
                           }
                       },

                    {
                        template: kendo.template("<input type='checkbox' class = 'checkbox' id='chkbx' data-id='#:Id #' />"),
                        attributes: {
                            style: "vertical-align: top; text-align: center;"
                        }
                    },
                ],

            }).data('KendoGrid');
        },

    })
 .on("click", ".k-primary", function (e) {
     var dialog = $(e.currentTarget).closest("[data-role=window]").getKendoWindow();
     var textbox = dialog.element.find(".k-textbox");
     var LinKLabel = $('#LL').val();
     var roles = $(chkbx).data('roleid');
     console.log(PageLocation);
     node.text = undefined;
     node.set("LINK_LABEL", LinKLabel);
     node.set("Roles", roles);
     dialog.close();
     var treenode = treeview.dataSource.get(itemid);
     treenode.set("LINK_LABEL", LinKLabel);
     treenode.set("id", Id);
     treenode.set("roles", roles);
     treenode.LINK_LABEL = LinKLabel;
     treenode.ID = Id;
     treenode.roles = roles;

     var rid = $(chkbx).data('roleid');

     $.ajax({
         url: "/Services/MenuServices.asmx/UpdateTreeDetails",
         contentType: "application/json; charset=utf-8",
         type: "POST",
         datatype: "json",
         data: JSON.stringify({ "Json": treenode })
     });
     console.log(JSON.stringify(treenode));
 })
  }

Answer 1

我假设您希望在这一行中获得这些ID：

myMethod(Object a)

右？我不知道的是您想要获取该数据的格式。使用以下代码，您可以在像var roles = $(chkbx).data('roleid');这样的数组对象中获取角色数据，请查看：

{ id: 1, value: true }

Demo。无论如何你想要它，你可以在var grid = $("#grid").data("kendoGrid"), ids = []; $(grid.tbody).find('input.checkbox').each(function() { ids.push({ id: $(this).data("id"), value: $(this).is(":checked") }); });循环中更改它。

<强>更新

要仅获取选中的复选框，请将选择器更改为：

each

Demo

Kendo Grid多选复选框

1 个答案: