【发布时间】:2012-11-28 14:39:59
【问题描述】:
我正在使用 DynaTree JavaScript 树并且一直在修改它。具体来说,我正在尝试根据节点类型添加多个上下文菜单。
基本上我的想法是让上下文菜单向我的 MVC (2) 控制器发出 ajax 请求,并将此信息作为 JSON 传递,用于创建可在 c# 中访问的类。
在这里浏览了大约 500 个帖子后,我已经正常工作了!现在我需要再次修改 JS 以便根据类型选择适当的上下文菜单。
我的列表看起来像
<div id="tree">
<ul>
<li id="'ID':1,'TYPE':1" title="Look: a tool tip!">item1 with key and tooltip</li>
<li id="'ID':2,'TYPE':2" class="activate">item2: activated on init</li>
<li id="'ID':3,'TYPE':3" class="folder">Folder with some children
<ul>
<li id="'ID':4,'TYPE':1">Sub-item 3.1</li>
<li id="'ID':5,'TYPE':1">Sub-item 3.2</li>
</ul>
</li>
<li id="'ID':6,'TYPE':1" class="expanded">Document with some children (expanded on init)
<ul>
<li id="'ID':7,'TYPE':1'">Sub-item 4.1</li>
<li id="'ID':8,'TYPE':1'">Sub-item 4.2</li>
</ul>
</li>
<li id="'ID':9,'TYPE':1" class="lazy folder">Lazy folder</li>
</ul>
</div>
然后我返回 ID 并使用 jQuery.parseJSON 发送到 MVC。
看不懂的JS在这里:
function bindContextMenu(span) {
// Add context menu to this node:
debugger;
$(span).contextMenu({ menu: "myMenu1" }, function (action, el, pos) {
var node = $.ui.dynatree.getNode(el).toString();
node = node.replace(/'/g, '\"');
node = jQuery.parseJSON('{' + node + '}');
$.ajax({
type: "POST",
url: "/TreeView/Click/",
data: { ID: node.ID, TYPE: node.TYPE },
error: function (request) { $("#message").html("error"); },
success: function (result) { $("#message").html("Success - " + result); }
})
});
};
这一行 - $(span).contextMenu({ menu: "myMenu1" }, function (action, el, pos) {
似乎既可以设置上下文菜单,也可以在单击上下文菜单时触发。如果有人可以为 Google 提供一些关键字,我会很高兴,因为我不知道。
提前致谢
【问题讨论】:
-
顺便说一句:我不是 100% 清楚你打算在这里做什么,但似乎你是在说每次用户点击这些树项目中的一个时,你重新进行 AJAX 调用以获取项目的上下文菜单?除非您确实需要为每个项目设置不同的上下文菜单,否则我会在页面中嵌入上下文菜单的代码并使用一些胶水 javascript 显示它;否则,用户每次尝试执行普通 UI 操作时都会等待您的服务器 - 打开上下文菜单;更不用说服务器上的负载了。
-
嗨 bloopletech,对不起,我不清楚。上下文菜单保存在三个硬编码在 html 中的列表中。 ajax 部分将在与上下文相关的幕后执行数据库类型的操作 - 即删除上下文单击会删除某些内容。
-
但基本上我的问题是: $(span).contextMenu({ menu: "myMenu1" }, function (action, el, pos) { 关键字函数出现时没有给出函数名。给我的知识有限,这是不可能的,这是什么以及我谷歌的目的是什么?
-
哦,那是
anonymous function;您正在声明该函数,然后将该函数作为 contextMenu 函数的参数传递。 -
再次感谢,这将是一个真正的帮助。
标签: javascript jquery ajax