【问题标题】:How to get the parent id of the parent when we click on the child check box当我们点击子复选框时如何获取父节点的父ID
【发布时间】:2013-03-14 05:08:05
【问题描述】:

我有一个带有复选框模板的剑道树视图。

我的html代码

<div id="treeview-left" style=" height: 375px; position: absolute;top: 30px;"></div>

我已将树视图定义为:

var treeview1 = $('#treeview-left').kendoTreeView({
            select: onSelect,
            checkboxTemplate: kendo.template($("#treeview-checkbox-template").html()),            
            dragAndDrop: true,
            dataSource: parent, 
            dataTextField: ["parentName", "childName"]
        }).data("kendoTreeView");

复选框模板定义如下:

<script id="treeview-checkbox-template" type="text/kendo-ui-template">
            <input type="checkbox" />
</script>

数据源将是

var parent = new kendo.data.HierarchicalDataSource({
            type: "POST",
            dataType: "json",
            transport: {
                read: {
                    url: "/Projects/leftdisplay"
                }
            },
            schema: {
                model: {
                    id: "parentid",
                    hasChildren: "childName",
                    children: child
                }
            }
        });

现在父母的孩子会是这样的:

   var child = {
            type: "POST",
            dataType: "json",
            transport: {
                read: {
                    url: function (options) {
                        return kendo.format("/projects/modulesleftdisplay?parentid=" + options.parentid + "&roleid=" + rolevalue + "&projectid=" + projectid + "");
                    }
                }
            },
            schema: {
                model: {
                    id: "childid",
                    hasChildren: function () {
                        return false;
                    }
                }
            }
        };

现在,当我单击子复选框时,我想获取所选子项的父 ID。我怎么能得到那个。

我写过类似的代码

$("#treeview-left [type=checkbox]").live('change', function (e) {      
    var chkBox = $(this)
    var parentid = chkBox.parent();
    var date = $('#treeview-left').data('kendoTreeView').dataItem(parent_id);
    var parid = date.id;
    var childid = $('#treeview-left').data('kendoTreeView').dataItem(parentid);
});

但是parid没有得到。如何获取所选孩子的父 ID。任何帮助表示赞赏。

【问题讨论】:

  • 我已经编辑了我的问题
  • @Naidu,检查一个基本问题:当你计算date时,treeview是什么?是treeview 还是treeview-left?。
  • @OnaBai 我也用过treeview-left,但还是没有成功

标签: javascript jquery asp.net-mvc kendo-ui kendo-treeview


【解决方案1】:

试试这个:

// Find all the checkboxes:
var checkboxes = Array.prototype.slice.call(document.querySelectorAll('#yourFormsID input[type=checkbox]'));

checkboxes.forEach(function(checkbox) {                //<== loop through checkboxes
    checkbox.addEventListener('change', function() {   //<== When clicked:
        console.log(this.parentNode.id);               //<== Log the id of the checkbox's parentNode in the console.
    }, false);
});

Here's a demo。请务必打开控制台。

【讨论】:

  • 我应该在哪里使用复选框更改事件以及什么是元素和父节点
  • 我没有使用表单。我正在使用剑道 UI 树视图。这个例子不适合我
  • @Naidu 你用的是什么浏览器?您是否打开控制台查看单击复选框时会发生什么?
  • 是的,它越来越不确定
  • @Naidu 除非您更具描述性,否则我无法帮助您。 “它不起作用”不是描述性的,“它变得不确定”也不是。什么是未定义的?
【解决方案2】:

你可以用这个

   var parentId = $(this).parent().closest(parent element).attr('id')

例子:

 var parentId  = $(this).parent().closest('li').attr('id')

而不是

 var chkBox = $(this)

 var parentid = chkBox.parent();

获取父ID。

【讨论】:

  • 什么是父元素
  • 第一个示例中的父元素应该是什么。如果我使用第二个示例,我会变得不确定
  • 你期待什么
  • 这将是一个整数,将分配给每个父母
  • 我已经在我的问题中给出了代码。最初在父数据源中分配父元素,然后为每个父元素分配子元素
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-10-24
  • 2021-03-23
  • 1970-01-01
  • 1970-01-01
  • 2022-07-01
  • 1970-01-01
相关资源
最近更新 更多