我正在使用 teleriks treeview 控件(asp.net mvc 扩展),其中我最多可以有三个子节点,如下所示(drumroll......下面很棒的图):
它有自己的格式,看起来有点像这样:
<%=
Html.Telerik().TreeView()
.Name("TreeView")
.BindTo(Model, mappings =>
{
mappings.For<Node1>(binding => binding
.ItemDataBound((item, Node1) =>
{
item.Text = Node1.Property1;
item.Value = Node1.ID.ToString();
})
.Children(Node1 => Node1.AssocProperty));
mappings.For<Node2>(binding => binding
.ItemDataBound((item, Node2) =>
{
item.Text = Node2.Property1;
item.Value = Node2.ID.ToString();
})
.Children(Node2 => Node2.AssocProperty));
mappings.For<Node3>(binding => binding
.ItemDataBound((item, Node3) =>
{
item.Text = Node3.Property1;
item.Value = Node3.ID.ToString();
}));
})
%>
这会导致它像这样渲染。我发现当我设置值时它在隐藏输入中呈现是不寻常的?但无论如何:...
<li class="t-item">
<div class="t-mid">
<span class="t-icon t-plus"></span>
<span class="t-in">Node 1</span>
<input class="t-input" name="itemValue" type="hidden" value="6" /></div>
<ul class="t-group" style="display:none">
<li class="t-item t-last">
<div class="t-top t-bot">
<span class="t-icon t-plus"></span>
<span class="t-in">Node 1.1</span>
<input class="t-input" name="itemValue" type="hidden" value="207" />
</div>
<ul class="t-group" style="display:none">
<li class="t-item">
<div class="t-top">
<span class="t-in">Node 1.1.1</span>
<input class="t-input" name="itemValue" type="hidden" value="1452" />
</div>
</li>
<li class="t-item t-last">
<div class="t-bot">
<span class="t-in">Node 1.1.2</span>
<input class="t-input" name="itemValue" type="hidden" value="1453" />
</div>
</li>
</ul>
</li>
</ul>
我正在做的是在用户单击某个节点后更新 div。但是当用户单击节点时,我想发送 ID 而不是节点文本属性。这意味着我必须从这些类型行 <input class="t-input" name="itemValue" type="hidden" value="1453" />
中的值中取出它,但每次都可以以不同的方式嵌套,因此我现有的代码并不总是有效:
<script type="text/javascript">
function TreeView_onSelect(e) {
//`this` is the DOM element of the treeview
var treeview = $(this).data('tTreeView');
var nodeElement = e.item;
var id = e.item.children[0].children[2].value;
...
</script>
基于此,每次使用 javascript/jquery 获取适当 id 的更好方法是什么?
编辑:
抱歉需要澄清一些事情
1) 是的,我正在处理对 li
的点击树的 s & 想要找到嵌套隐藏输入字段的值。正如您所看到的,从 telerik 代码中,设置 item.Value = Node2.ID.ToString();
使其呈现在隐藏的输入字段中。
我正在响应树中任何位置的点击,因此我无法使用现有的代码,该代码依赖于一组关系(它适用于第一个节点(节点 1),不适用于下面嵌套的任何节点)
我想要的是,每当有这样的东西时,代表一个节点,然后单击:
<li class="t-item t-last">
<div class="t-bot">
<span class="t-in">Node 1.1.2</span>
<input class="t-input" name="itemValue" type="hidden" value="1453" />
</div>
</li>
我想要输入中的 ID 值,在本例中 1453
.
希望现在这更有意义。
如果可能的话,希望扩展它以将被单击的元素的嵌套程度存储在变量中,即如果单击节点 1.1.2 返回 2,节点 1.1 返回 1,节点 1 返回 0强>
最佳答案
有点不清楚你在问什么,但根据你的 JavaScript 片段,我猜测你正在处理对树的 li
的点击并想要找到嵌套隐藏字段的值
?如果是这样,你想要这样的东西:
function TreeView_onSelect(e) {
var id = $(e.item).find(".t-input:first").val();
}
编辑:在回答您的后续问题时,您应该能够通过以下方式获取树深度:
var depth = $(e.item).parents(".t-item").length;
关于javascript - 使用 jQuery 从输入控件获取值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5138722/