Treeview structure in asp.net mvc with jQuery

Question

I need to create a treeview structure using jQuery in asp.net mvc applicatiopn.

Let me describe my scenario: I have two tables - Document Template and Instructions Document template has different documents and instructions under these documents are there in Instructions table.

The DocumentTemplate table looks like

The Instructions table has DocId as foreign key and it looks like:

I want the tree with structure

TestDoc1 TestDoc1Instn1 TestDoc1Instn1.1 TestDoc2 TestDoc2Instn1 TestDoc2Instn2.1 TestDoc2Instn2.1.1 TestDoc2Instn2.2 TestDoc2Instn2.2.1 TestDoc2Instn2.2.2 TestDoc3 TestDoc3Instn1 TestDoc4 TestDoc4Instn1

Can any help me on this? Thanks for all help in prior.

Answer 1

我可以为您提供两种解决方案（取决于您要如何表示数据）：jQuery TreeView插件（ ASP.NET MVC的使用示例 ）或jqGrid插件TreeGrid功能（ ASP.NET MVC的使用示例 ）

Answer 2

In my Mvc Controls Toolkit I have a TreeView server control. It allows also node editing, insertion of new nodes, and moving sub-tree into another location by dragging it with the mouse. All changes are reflected Automatically on data structures on the server side when the view is posted. Moreover all nodes are templated and the same tree can have different type of nodes. Give a look here: http://mvccontrolstoolkit.codeplex.com/wikipage?title=TreeView