Data manipulation of Tree Structure UI

The Javascript notify the change of Tree UI's change by ajax. This page shows you the server side program to update the database for the change.

Location of the source code

There are following type of the server side program. The user program is one to use the library program. The library program is reusable program.

Therefore on creating your own application, write your user side program.

User program

The user program is in the "jqTree with Database" exmaple's folder. More detail, please take a look at the main program introduction page.

Library program

The library program is in the "ALINOUS_HOME/inclides/" folder.

Tree UI library

The "treemodel.alns" is the library file.

Add a new tree node

When you add the tree node from the dialog shown after click the link to edit the tree node, and input the node name, submit the form, then following server side program is executed.


This program calls TreeModel with switching case by the position to add the new node. Following position is available.

  • After the target node
  • Before the target node
  • Inside the target node

For each position, the TreeModel library has a function to add a new tree node.

Delete a tree node

When you delete a node, following program is executed in the server side.


This TreeModel API has callback script. After the tree node is deleted, the callback script is executed automatically.

Move a Tree Node

When the tree node is moved by drag and drop, following server side program is executed.

When you move the tree element, the destination location type toward the target is same with on creating a new node.

  • After the target node
  • Before the target node
  • Inside the target node

On moving the tree node, you can specify the callback script to execute after move the tree node.


Go to Top