1
我第一次使用jstree與asp.net mvc 4，實體框架6.1代碼第一次。如何在一個按鈕上點擊保存jstree？
我有表我的數據庫爲Categories
CategoryId Name CreatedDate ParentId
1 category 2014-05-06 19:00:20.107 0
2 Category1 2014-05-06 19:00:20.107 1
3 Category2 2014-05-06 19:00:20.107 1
我與此表結合我jstree作爲
我Categorycontroller代碼
public JsonResult GetList(int id = 0)
{
var objList = GetTreeVeiwList();
return Json(objList, JsonRequestBehavior.AllowGet);
}
公開名單GetTreeVeiwList（） {
var rootNode = (from e1 in _CategoriesBusiness.Select()
where e1.ParentId == 0
select new TreeViewNodeVM()
{
id =Convert.ToString(e1.CategoryId),
text = e1.Name
}).ToList();
BuildChildNode(rootNode);
return rootNode;
}
public JsonResult SaveChanges(string ar)
{
var data = new JavaScriptSerializer().Deserialize<string[]>(ar);
Categories objCategories=null;
foreach (var a in data)
{
var ab = a.Split(' ');
objCategories=new Categories();
int tempCategoryId;
if (int.TryParse(ab[1], out tempCategoryId))
{
objCategories.CategoryId = tempCategoryId;
var objcat=(from cat in _CategoriesBusiness.Select() where cat.CategoryId==tempCategoryId select cat).FirstOrDefault();
if (objcat != null)
{
objcat.Name = ab[0].Trim();
int tempParantId;
if (int.TryParse(ab[2], out tempParantId))
{
objcat.ParentId = tempParantId;
}
_CategoriesBusiness.Update(objcat);
}
else
{
objCategories.CategoryId = Convert.ToInt32(ab[1]);
objCategories.Name = ab[0];
int tempParantId1;
if (int.TryParse(ab[2], out tempParantId1))
{
objCategories.ParentId = tempParantId1;
}
_CategoriesBusiness.Create(objCategories);
}
}
else
{
objCategories.Name = ab[0];
int tempParantId1;
if (int.TryParse(ab[2], out tempParantId1))
{
objCategories.ParentId = tempParantId1;
}
_CategoriesBusiness.Create(objCategories);
}
}
return Json(new { },JsonRequestBehavior.AllowGet);
}
private void BuildChildNode(List<TreeViewNodeVM> ListrootNode)
{
foreach (TreeViewNodeVM rootNode in ListrootNode)
{
if (rootNode != null)
{
List<TreeViewNodeVM> chidNode = (from e1 in _CategoriesBusiness.Select()
where e1.ParentId.ToString() == rootNode.id
select new TreeViewNodeVM()
{
id = Convert.ToString(e1.CategoryId),
text = e1.Name
}).ToList<TreeViewNodeVM>();
if (chidNode.Count > 0)
{
BuildChildNode(chidNode);
foreach (var childRootNode in chidNode)
{
rootNode.children.Add(childRootNode);
}
}
}
}
}
和觀點是：
@*@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}*@
<link href="../../Content/dist/themes/default/style.min.css" rel="stylesheet" />
<script src="../../Content/dist/libs/jquery.js"></script>
<script src="../../Content/dist/jstree.js"></script>
@*<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.6/jquery.min.js" type="text/javascript"></script>*@
<script type='text/javascript' src="http://static.jstree.com/v.1.0pre/jquery.hotkeys.js"></script>
@model List<Web.ViewModels.TreeModels.TreeViewNodeVM>
@{
ViewBag.Title = "Index";
}
<h2>
Categories</h2>
<input type="button" id="btnaddFolder" value="Add new folder" onclick="File_Folder()" />
<input type="button" id="btnaddCat" value="Add new Category" onclick="File_create()" />
<input type="button" id="btnSave" value="Save Changes" onclick="SaveChanges()" />
<input type="button" id="btnCancel" value="Cancel" />
<div id="jstree">
</div>
<script>
function SaveChanges() {
debugger
var ar = [];
var i = 0;
var arr = "";
$('#jstree li').each(function() {
debugger
var id = $(this).attr('id');
var text = $(this).find("a:first").text();
if ($(this).parent('ul.jstree-children')) {
var parent = $(this).parent('ul.jstree-children').parent('li').attr('id');
alert(text + " " + id + " " + parent);
var item = text + " " + id + " " + parent;
ar.push(item);
i++;
}
});
arr = JSON.stringify(ar);
//$('#jstree li.jstree-node').each(function() {
// some.push($(this).attr("id"));
// // or
// //some.push(this.id);
//});
debugger;
$.ajax({
type: 'post',
url: "/Category/SaveChanges", data: { ar: arr }, success: function (result) {
$("#div1").html(result);
}
});
}
function AddNewNode()
{
File_create();
}
$(function() {
// 6 create an instance when the DOM is ready
debugger
$("#jstree").jstree({
"core": {
"animation": 0,
"check_callback": true,
"themes": { "stripes": true },
'data': {
'url': function (node) {
debugger
return node.id === '#' ?
'/Category/GetList' : '/Category/GetList1';
},
'data': function (node) {
debugger
return { 'id': node.id };
}
}
},
"contextmenu": {
"items": function ($node) {
var tree = $("#jstree").jstree(true);
return {
"Create": {
//"separator_before": false,
//"separator_after": false,
"label": "Create",
"action": function (data) {
debugger;
File_create();
//var ref = $('#jstree').jstree(true);
//ref.create_node(data);
}
},
"Rename": {
"separator_before": false,
"separator_after": false,
"label": "Rename",
"action": function (obj) {
debugger;
tree.edit($node);
}
},
"Remove": {
"separator_before": false,
"separator_after": false,
"label": "Remove",
"action": function (obj) {
tree.delete_node($node);
}
}
};
}
},
"types": {
"#": {
"max_children": 1,
"max_depth": 4,
"valid_children": ["root"]
},
"root": {
"icon": "/static/3.0.0/assets/images/tree_icon.png",
"valid_children": [],
"name":"Folder"
},
"default": {
"valid_children": ["default", "file"]
},
"file": {
"icon": "glyphicon glyphicon-file",
"valid_children": []
}
},
"plugins": [
"contextmenu", "dnd", "search",
"state", "types", "wholerow"
]
})
});
function File_Folder() {
debugger
var ref = $('#jstree').jstree(true),
sel = ref.get_selected();
if (!sel.length) { return false; }
var number = 1 + Math.floor(Math.random() * 10);
sel = ref.create_node(sel, { "type": "default"});
if (sel) {
ref.edit(sel);
}
}
function File_create() {
debugger
var ref = $('#jstree').jstree(true),
sel = ref.get_selected();
if (!sel.length) { return false; }
sel = ref.create_node(sel, { "type": "file"});
if (sel) {
ref.edit(sel);
}
}
</script>
它表明這樣的：
我必須保存在數據庫中的所有節點上Save changes button click與有CategoryId，Name，ParentId如果CategoryId存在，那麼update如果不是那麼insert new node
現在在照片中可以看到有一個根節點類別，我已經通過點擊add new folder button現在又增加了3個個子節點leavel1,leavel2,leavel3，如果我想保存在數據庫中的這些子節點與有parentid這裏的主要問題是：
leavel1有一個父母ID爲Category node，因爲它確實存在id數據庫，level2父母應該是level1，但它不存在於數據庫中，我已經動態地在cint方式（在clint方面）包裝它。所以我如何設置level2 and level3 parantId。？
no @LIUFA我已經將所有節點保存在一個按鈕上單擊保存更改按鈕單擊 –