Easyui treegrid implementation (1) --- _ parentid, beginedit, canceledit, enablednd...

1. Describe the requirement:

Tree on the left: province> city> hospital> Department tree on the right: Department

Main functions: 1) the left Tree lists association information between different levels;

2) query the left Tree by province or city;

3) Select the department line to modify and save the labels and descriptions;

4) drag the right node to the hospital node in the left tree and save it to the database.

2. It took nearly a week to implement all functions, because I didn't know about easyui before and encountered many problems:

1) because the tree on the left shows a lot of information, the database design has never imagined a tree-like display. _ parentid has a conflict problem and is helpless, strings are added to each ID for differentiation. Some JSON files are as follows:

{"Footer": [{"name": "Total:", "ID": NULL, "type": NULL, "tag": "129", "cityid ": null, "provinceid": NULL, "_ parentid": NULL, "hospid": NULL, "Introduction": NULL, "iconcls": "icon-sum ", "deptid": NULL}], "Total": 29, "rows": [{"name": "Beijing", "ID": "1", "type ": null, "tag": NULL, "cityid": NULL, "provinceid": NULL, "_ parentid": NULL, "hospid": NULL, "Introduction": NULL, "iconcls": "icon-OK", "deptid": NULL}, {"name": "Haidian District", "ID": "C1", "type": NULL, "tag": NULL, "cityid": NULL, "provinceid": NULL, "_ parentid": "1", "hospid": NULL, "Introduction": NULL, "iconcls": "tree-folder", "deptid": NULL}, {"name": "Haidian hospital", "ID": "H12", "type ": "3", "tag": NULL, "cityid": NULL, "provinceid": NULL, "_ parentid": "C1", "hospid": NULL, "Introduction": NULL, "iconcls": "tree-folder", "deptid": NULL}]}

Note: The _ parentid fixed writing method has not been found how to modify it. Please advise
2) Implement edit-beginedit

Select a row and click "Update" to modify the label and description columns. Note: The code for treegrid initialization:

Columns: [{Title: 'name', field: 'name', width: 120}, {field: 'tag', Title: 'tag', width: 60, align: 'center', Editor: 'text'}, {field: 'insert', Title: 'Introduction', width: 180, Editor: 'text'}],

Because the name does not need to be modified, you can leave the editor value unset. The code for updating and canceling buttons is based on the Demo code on the official website. Save the code as needed:

VaR editingid; function edit () {If (editingid! = Undefined) {$ ('# TG '). treegrid ('select', editingid); return;} var ROW = $ ('# TG '). treegrid ('getselected'); If (ROW) {If (4 = row. type) {editingid = row. ID; $ ('# TG '). treegrid ('ineinedit ', editingid);} else {$. messager. alert ('Warning ',' only department information can be edited! '); Return ;}} function cancel () {If (editingid! = Undefined) {$ ('# TG'). treegrid ('canceledit', editingid); editingid = undefined;} function save () {If (editingid! = Undefined) {var T = $ ('# TG'); T. treegrid ('enabled', editingid); var ROW = T. treegrid ('getselected'); var treenode = {'hospid': Row. _ parentid, 'id': Row. ID, 'tag': Row. tag, 'insert': Row. introduction}; $. post ("hospidept_tree/update. action ", treenode, function (data) {cancel (); search_event ();});}}

The stored implementation needs to modify the database, so send a request ---

Easyui treegrid implementation (1) --- _ parentid, beginedit, canceledit, enablednd...