Planted a tree in November

After March November, the North officially entered the cold winter. Throughout November, I planted a tree. Specifically, I was building a tree menu on a web page and implementing its editing and storage problems.

I have always liked tree menus. The most specific manifestation is that I have always managed Windows folders through "Resource Manager. Tree menus are intuitive and concise, with simple interface layout and clear logic. I am trying to operate the menu of its tree structure in each language, starting with VB, to Delphi and ASP. NET. Javascript is no exception.

The more concise things on the surface, the more complicated the logic behind them. This seems to be a rule, as does the tree menu. The first is how to describe and store tree menus using a two-dimensional structured data structure such as a database table. Fortunately, this problem has been solved by talented programmers and is almost perfect.

The second is how to present these tree logical structures on the web page. This is a key point. For simple presentation, it is easier to retrieve data and place it in the shape of a tree. However, it is not easy to add, delete, modify, or delete a tree menu like desktop programming. In fact, I spent a lot of energy here. The first consideration is to implement these functions on your own, but I immediately rejected this stupid idea-now is not an era of "making wheels". I must learn to stand on the shoulders of giants.

Therefore, we decided to select a mature JS tree menu component. After filtering out the suspicious things made by online enthusiasts and havip, we finally chose jquery simpletree, xtree, and dhtmlxtree. Simpletree and xtree provide excellent tree menus. with Ajax technology, menu nodes can be opened dynamically, so that millions of records can be loaded in seconds ", this is an excellent design. Although it is actually a "fake" technology, invisible data actually does not exist. It will be retrieved temporarily when we want to see it. However, simpletree and xtree do not actually have the Edit function for the JS tree menu. After the data in the database is updated, the node of the entire tree must be refreshed, locating the current node is a task that cannot be completed, and the user experience is very poor. It took a lot of time to get familiar with and test simpletree and xtree, and finally gave up on them.

Dhtmlxtree is the best tree menu I have ever encountered. It is circulated on the Internet as its 1.5 Standard Edition (free trial), but its 1.3 Professional Edition is indeed available, with many features and fewer bugs, but it requires a payment, hundreds of dollars. Occasionally, I got its 1.3 Professional Edition on the Internet. It was also made by a netizen from abroad. Of course, it was pirated for me.

Dhtmlxtree is now in version 2.0 and is already part of the dhtmlxsuite2.0 Suite (http://www.dhtmlx.com /). The dhtmlxsuite2.0 kit includes a large number of Web Front-end components, and is also divided into a free Standard Edition (subject to the GPL license) and a paid professional edition (with license cial license and Enterprise License license ). Unfortunately, there is a fatal bug in the dhtmlxtree2.0 Standard Edition that I used, and I have to give up. I can only use a lower version. It's okay, it's enough.

The editing and storage of tree menus are very different from the two-dimensional data operations of relational databases. They must be implemented through a program (I used Ajax technology) make the shape of the database and tree synchronized while editing, and the next time you open the tree, that is, the level, front and back, and parent-child relationship are not messy. Because "relationship" is the main logic of the tree, the node movement function must be available. Otherwise, it is very difficult for users to operate. I have implemented the sibling function at the same level. Long-distance node movement can also be achieved because of complicated interface operations. Considering that I am currently editing tree columns of a website, this function is of little significance and has been cut down. If you want to implement the node copy function in the future, it will be convenient to create a new node. The frontend and backend relationships of nodes must be recorded by a sorting field in the table, because they are not suitable for sorting. However, the sorting problem has always been a problem. I don't think my sorting practice ("algorithm" is a bit blushing) is good, but I would like to ask some programmers who call it ERP, they do not agree. It seems that this is the only way to do this-we hope version 2009 can solve these problems ,:).

In this infinitely hierarchical menu editing system, the biggest workload and difficulty is not to operate the database, but to select the JS component of the Web Front-end, and to familiarize yourself with it and operate on it, especially to synchronize with the back-end table. I used the jquery framework, but it was a little faster. It should be said that it also reduced the compatibility of browsers.

I spent most of the time in November on this tree, which is actually a painstaking effort and life. Either I feed the tree or I am hanging on the tree, and many times I am facing a choice. Many times I went online to search for answers, and many times I thought about it while walking. I finally got a tree like this: Not a big tree, it is not a simple tree.

Zhang Qing (mesh)
From mesh horizon: http://blog.why100000.com
Why 100,000 computer learning networks: http://www.why100000.com
Csdn blog: http://blog.csdn.net/zhangking