[英]MVC4 JsTree Passing Selected Node to Controller
I have the following javascript in my view to build a TreeView and get data from server: 我在视图中有以下javascript来构建TreeView并从服务器获取数据:
$(function () {
$("#EquipmentTree").jstree({
"json_data": {
"ajax": {
"url": "/Helper/GetEquipTreeViewData",
"type": "POST",
"data": function () {$("#EquipmentTree").jstree('get_selected').attr('id');},
"dataType": "json",
"contentType": "application/json charset=utf-8"
}
},
"themes": {
"theme": "default",
"dots": true,
"icons": true,
"url": "Scripts/jstree-v.pre1.0/themes/default/style.css"
},
"plugins": ["themes", "json_data"],
"core": { "animation": 100 }
});
});
My controller has: 我的控制器有:
public ActionResult GetEquipTreeViewData(string nodeId)
{
do some stuff
return Json (data);
}
Everthing works fine except that I never get the selected node. 除了我从未获得所选节点外,Everthing工作正常。 I always get NULL at nodeId.
我总是在nodeId得到NULL。 Even if I change to:
即使我改为:
"data": { nodeId : "TEST" }
I still get null or some Javascript error. 我仍然得到null或一些Javascript错误。 This is turning me nuts.
这让我感到疯狂。 I tried also:
我也尝试过:
"data" : JSON.stringfy(nodeId);
And continue sending null. 并继续发送null。
It is supposed to be a normal AJAX call, but it isn´t. 它应该是一个普通的AJAX调用,但它不是。 I just need to pass the selected treenode to controller to reload the result page based on user selection.
我只需要将选定的treenode传递给控制器,根据用户选择重新加载结果页面。
Thanks for help. 感谢帮助。
[EDIT] My results on testing variants: [编辑]我对测试变体的结果:
TEST1: TEST1:
var selected_node = $("#EquipmentTree").jstree('get_selected').attr('id');
$("#EquipmentTree").jstree({
"json_data": {
"ajax": {
"url": "/Helper/GetEquipTreeViewData",
"type": "POST",
"data": { nodeId : selected_node },
"dataType": "json",
"contentType": "application/json; charset=utf-8"
}
},
"themes": {
"theme": "default",
"dots": true,
"icons": true,
"url": "Scripts/jstree-v.pre1.0/themes/default/style.css"
},
"plugins": ["themes", "json_data"],
"core": { "animation": 100 }
});
});
Error at browser: Invalid Jason Primitive: nodeId 浏览器出错:无效的Jason Primitive:nodeId
[TEST2] [TEST2]
Code: 码:
$(function () {
var selected_node = $("#EquipmentTree").jstree('get_selected').attr('id');
$("#EquipmentTree").jstree({
"json_data": {
"ajax": {
"url": "/Helper/GetEquipTreeViewData",
"type": "POST",
// "data": { nodeId : selected_node },
"data": JSON.stringify ("nodeId : " + selected_node),
"dataType": "json",
"contentType": "application/json; charset=utf-8"
}
},
"themes": {
"theme": "default",
"dots": true,
"icons": true,
"url": "Scripts/jstree-v.pre1.0/themes/default/style.css"
},
"plugins": ["themes", "json_data"],
"core": { "animation": 100 }
});
});
Called the function at the controller, but received null. 在控制器上调用该函数,但收到null。 Browser data:
浏览器数据:
Request URL:http://localhost:7767/Helper/GetEquipTreeViewData
Request Method:POST
Status Code:200 OK
Request Headersview parsed
POST /Helper/GetEquipTreeViewData HTTP/1.1
Host: localhost:7767
Connection: keep-alive
Content-Length: 24
Accept: application/json, text/javascript, */*; q=0.01
Origin: http://localhost:7767
X-Requested-With: XMLHttpRequest
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1547.76 Safari/537.36
Content-Type: application/json; charset=UTF-8
Referer: http://localhost:7767/MasterDataAdminEquipment
Accept-Encoding: gzip,deflate,sdch
Accept-Language: pt-BR,pt;q=0.8,en-US;q=0.6,en;q=0.4
Cookie: ASP.NET_SessionId=yuf1omlottf0xb4aklvfr4wg
Request Payload view source
nodeId : EquipmentTree
No Properties
Repair that it has a Request Payload with "No Properties". 修复它具有“无属性”的请求有效负载。 Normally we would have a Form Data with a dictionary of "Parameter" and "Value" pairs.... This is the n´th combination I´m trying.
通常情况下,我们会有一个表格数据,其中包含“参数”和“价值”对的字典....这是我尝试的第n个组合。 Very strange...
很奇怪...
Try this instead : 试试这个:
public JsonResult GetEquipTreeViewData(string nodeId)
{
do some stuff
return Json (data, JsonRequestBehavior.DenyGet);
}
In my code I use: 在我的代码中我使用:
"contentType": "application/json; charset=utf-8"
(Note the ';') (注意';')
Apart from this, when the ajax call returns, you should get back a JSON formatted response: have you tried to inspect it using Chrome Developer tools? 除此之外,当ajax调用返回时,您应该返回JSON格式的响应:您是否尝试使用Chrome Developer工具进行检查? Do you receive the response?
你收到回复吗?
Last but not least, also if you get a correct response, no node will be selected by default, so querying get_selected
will return undefined
. 最后但同样重要的是,如果您得到正确的响应,默认情况下不会选择任何节点,因此查询
get_selected
将返回undefined
。
OK. 好。 This is how I solved it (actually I changed to way to pass data to view):
这就是我解决它的方式(实际上我改为将数据传递给视图):
$(function () {
var selected_node = $("#EquipmentTree").jstree('get_selected').attr('id');
var link = '@Url.Action("GetEquipTreeViewData", "Helper", new { nodeId = "-1" })';
link = link.replace("-1", selected_node);
$("#EquipmentTree").jstree({
"json_data": {
"ajax": {
"url": link,
"type": "POST",
"dataType": "json",
"contentType": "application/json; charset=utf-8"
}
},
"themes": {
"theme": "default",
"dots": true,
"icons": true,
"url": "Scripts/jstree-v.pre1.0/themes/default/style.css"
},
"plugins": ["themes", "json_data"],
"core": { "animation": 100 }
});
});
Basically I quit javascript and went for the helpers (that´s they are here for.. To help)... Javascript is nice and powerfull, but still lack a good IDE environent/debugging tools to avoid these type of glitches related to commas, semicommas and other small things. 基本上我放弃了javascript并去找帮助者(这是他们在这里......为了帮助)... Javascript很好而且功能强大,但仍然缺乏一个好的IDE环境/调试工具来避免这些与逗号相关的故障,semicommas和其他小东西。 Remember me the old plain C++ times (I mean pure cc compiler, no IDE at all).
记住我原来的纯C ++时代(我的意思是纯cc编译器,根本没有IDE)。
Hope this helps someone! 希望这有助于某人!
Rds! RDS!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.