如何动态创建ASP.NET MVC TreeView? [英] How to create ASP.NET MVC TreeView dynamically ?

问题描述

我是ASP.NET MVC的新手.我想在运行时使用根，父级和chid节点的用户输入动态创建Treeview.

我希望应该有按钮(ADD根，添加节点，删除节点，编辑节点)，并且我应该有文本框.当用户在文本框中输入文本时
并单击添加根"按钮，它应该创建ROOT NODE，这样用户也应该能够创建父节点和子节点.

任何机构都可以向我发送此TreeView的任何链接或代码吗?

在此先感谢

Hi,

I am very new to ASP.NET MVC. I want to create treeview dynamically at runtime with user input for root, parent and chid node.

I want there should be buttons (ADD Root, Add Node, Delete Node, Edit Node) and there should me textbox. When user enter text in textbox
and click on ADD Root button, it should create ROOT NODE, and in this way user should be able to create parent and child nodes also.

Can any body please send me any link or code for this TreeView.

Thanks in advance

推荐答案

尝试这些

使用MVC框架渲染树视图 [ ^ ]

带有ASP.NET MVC和amp的分层树状视图; jQuery [

Try these

Rendering a tree view using the MVC Framework[^]

Hierarchical Treeview with ASP.NET MVC & jQuery[^]

我认为您应该尝试DJME 2软件包，其中有针对Mvc3的jQuery treeview扩展，下面是现场演示:
DJME2现场演示

这是TreeView扩展的用法:

I think you should try the DJME 2 package there is a jQuery treeview extension for Mvc3 here is the live demo :
DJME2 live demo

And this is the TreeView extension usage:

@{
    Ajax.Dna().TreeView("Tree1")
        .ExpandedLevel(0)
                   .Items(items =>
                   {
                       items.Add("Accordion", "#", Url.Content("~/webshared/home/images/dj_icons/icon_accordion.gif"))
                               .Items(subItems =>
                               {
                                   subItems.Add("Core feature", "#", Url.Content("~/content/images/icon_normal.gif"));
                                   subItems.Add("Autosize mode", "#", Url.Content("~/content/images/icon_normal.gif"));
                                   subItems.Add("Collapsible sections", "#", Url.Content("~/content/images/icon_normal.gif"));
                                   subItems.Add("Customize icons", "#", Url.Content("~/content/images/icon_normal.gif"));
                                   subItems.Add("NavView", "#", Url.Content("~/content/images/icon_normal.gif"))
                                                 .Items(navItems =>
                                                 {
                                                     navItems.Add("NavView Features", "#", Url.Content("~/content/images/icon_normal.gif"));
                                                     navItems.Add("Client side event handling", "#", Url.Content("~/content/images/icon_normal.gif"));
                                                     navItems.Add("Post back & Server events", "#", Url.Content("~/content/images/icon_normal.gif"));
                                                     navItems.Add("Programmatic NavView creation", "#", Url.Content("~/content/images/icon_normal.gif"));
                                                 });
                               });
                       items.Add("DatePicker", "#", Url.Content("~/webshared/home/images/dj_icons/icon_datepicker.gif"))
                              .Items(subItems =>
                              {
                                  subItems.Add("Core feature", "#", Url.Content("~/content/images/icon_normal.gif"));
                                  subItems.Add("Format date", "#", Url.Content("~/content/images/icon_normal.gif"));
                                  subItems.Add("Restrict date range", "#", Url.Content("~/content/images/icon_normal.gif"));
                                  subItems.Add("Localize calendar", "#", Url.Content("~/content/images/icon_normal.gif"));
                                  subItems.Add("Populate alternate field", "#", Url.Content("~/content/images/icon_normal.gif"));
                                  subItems.Add("Display modes", "#", Url.Content("~/content/images/icon_normal.gif"));
                                  subItems.Add("Display button bar", "#", Url.Content("~/content/images/icon_normal.gif"));
                                  subItems.Add("Display multiple months", "#", Url.Content("~/content/images/icon_normal.gif"));
                              });
                       items.Add("AutoComplete", "#", Url.Content("~/webshared/home/images/dj_icons/icon_autoComplete.gif"))
                               .Items(subItems =>
                               {
                                   subItems.Add("Default feature", "#", Url.Content("~/content/images/fav.gif"));
                                   subItems.Add("Remote data source", "#", Url.Content("~/content/images/fav.gif"));
                                   subItems.Add("Remote data with caching", "#", Url.Content("~/content/images/fav.gif"));
                                   subItems.Add("Scrollable results", "#", Url.Content("~/content/images/ok.gif"));
                                   subItems.Add("Multiple & remote", "#", Url.Content("~/content/images/ok.gif"));
                               });
                   })
                   .Render();
}

这篇关于如何动态创建ASP.NET MVC TreeView?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！