Tree樹狀圖的動態增刪查改(下)修改與刪除
一、整個樹狀圖中,修改和刪除可以說是比較容易理解的功能了,相比於新增操作也少了很多,也用不著把id傳來傳去的。
二、刪除節點
1、修改的位置比較特殊,所以就先說下刪除是怎麼做的吧。
2、第一步,刪除的方法必須寫在外掛自帶的remove的方法裡面,然後就是用外掛的方法獲取選中的值,再下去的就是判斷了。isParent等於true的話就說明選中的是父節點,並且下面是判斷到有子節點的,後面的兩個就是限制修改和提示選擇節點的功能了。
3、最後通過ajax提交id到資料庫,資料庫的刪除方法和普通的刪除方法是沒有什麼區別的,也是通過接收到id進行刪除的。
//刪除節點
function remove(e) {
var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
nodes = zTree.getSelectedNodes(),
isParent = nodes[0].isParent,
treeNode = nodes[0];
if (isParent == true) {
return layer.msg("該分類下存在子節點,請先刪除子節點")
}
if (treeNode.id == 403 || treeNode.id == 1) {
return layer.msg("系統初始化分類,不允許編輯、刪除或新增子分類。")
}
if (nodes.length == 0) {
layer.msg("請先選擇一個節點");
return;
} else {
$.ajax({
url: "/ClienteleManagement/Client/DeleteTree",
data: {
ClientfyID: treeNode.id //獲取選中節點的ID
},
type: "post",
success: function (data) {
if (data.State) {
var callbackFlag = $("#callbackTrigger").attr("checked");
zTree.removeNode(treeNode, callbackFlag);
$("#fontOrange2").text("");
$("#ClientClassifyId").val("")
} else {
layer.msg(data.Text)
}
}
})
}
};
四、修改節點
1、新增和刪除的操作方法都是寫在外掛自帶的方法裡面的,但修改比較特殊,修改並不是寫在edit()的裡面的,你要是想在填寫完成後離開了節點就修改的話,這就必須把修改寫在beforeRename()裡面。
2、修改的提交方式和其他兩個方法也是一樣的,先獲取選中值再提交id和修改後的名稱到控制器,控制器的查詢和普通的修改也是一樣的,這裡就不展示了
function beforeRename(treeId, treeNode, newName) {
var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
nodes = zTree.getSelectedNodes(),
treeNode = nodes[0];
if (newName.length == 0) {
layer.msg("節點名稱不能為空.");
var zTree = $.fn.zTree.getZTreeObj("treeDemo");
setTimeout(function () {
zTree.editName(treeNode) }, 10);
return false;
}//修改樹節點
$.ajax({
data: {
ClientClassifyID:treeNode.id,
ClientClassify: newName,
FatherID: treeNode.pId
}, url: "/ClienteleManagement/Client/RevampTree",
type: "post",
success: function (data) {
if (data.State) { //layer.msg(data.Text); }
else { edit(); //分類重複重新呼叫修改
layer.msg(data.Text)
}
}
});
return true;
}
相關文章
- Tree樹狀圖的動態增刪查改(中)新增節點
- onnx 增刪改查,修改節點,刪除節點,修改input,output
- 增刪改查
- 列表的增刪改查
- 字典的增刪改查
- layui的增刪改查UI
- mybatis的增刪改查MyBatis
- redist的增刪改查Redis
- SQL增刪改查SQL
- Mongoose查增改刪Go
- indexedDB 增刪改查Index
- mysql增刪改查MySql
- MySQL表的增刪改查(進階)下MySql
- (一)Mybatis基本配置,Statement方式,動態代理增刪改查MyBatis
- mongodb 基本增刪改查MongoDB
- MongoDB增刪改查操作MongoDB
- 單表增刪改查
- EFCore之增刪改查
- sql指令,增,刪,查,改SQL
- mysql基本增刪改查MySql
- drools動態增加、修改、刪除規則
- Java物件轉JSON時如何動態的增刪改查屬性Java物件JSON
- 02-CoreData 的增刪改查
- cobra.Command的增刪改查
- iOS CoreData (一) 增刪改查iOS
- Jfinal+layui增刪改查UI
- SQL 基礎增、刪、改、查SQL
- elasticsearch7.2增刪改查Elasticsearch
- [express+mongoose](增刪改查)ExpressGo
- CoreData - 簡單 增刪改查
- C# SqlSugar增刪改查C#SqlSugar
- rust sqlx 使用---增刪改查RustSQL
- PHP操作MongoDB(增刪改查)PHPMongoDB
- JavaWeb中jdbc增刪查改JavaWebJDBC
- gRPC 的增刪改查系列之啟動服務RPC
- JavaScript 動態新增與刪除元素JavaScript
- js實現表格的增刪改查JS
- MySQL表的增刪查改(提高篇)MySql