TreeView 控件与Vs2005(Asp.Net 2.0)

最新推荐文章于 2022-06-29 11:22:18 发布

luochengbang

最新推荐文章于 2022-06-29 11:22:18 发布

阅读量790

点赞数

文章标签： asp.net dataset google asp attributes xml

本文链接：https://blog.csdn.net/luochengbang/article/details/1790226

版权

reeView 控件为树状游览，类似于WINDOWS的资源管理器，TreeView 控件特点是信息项呈树状层次结构，能更清晰地表现主、细目关系，TreeView操作非常方便。

ASP.net 2.0以前，TreeView 控件并非VS附带的控件，而是TreeView IE Web 控件，而需要到微软官方去下载；在ASP.net 2.0 中，一些新的更加方便的控件被加了进来，为了方便自己学习这些控件，我把我自己学习这些控件的知识整理成这个系列文章。文章可能很简单，如果已经知道这些知识点的就不用再看了。
ASP.net 2.0中TreeView 控件。
以前我们要在网页中实现一个树，是非常麻烦的，其最麻烦的地方在于，兼容不同版本的浏览器。而绝大多数人，对各个浏览器分别支持那些JavaScript、CSS、Html 标签不是很熟悉，就造成开发一个树复杂，甚至只支持少量的浏览器。
ASP.net 2.0 中，微软为我们预先作了很多方面的控件，TreeView 就是其中一个。
在介绍TreeView 之前，我们先在网页中，用TreeView实现一个树。我们边看代码，边来学习这个树控件。
新建一个ASPX页面，输入如下代码：

程序代码

<html>
<body>
    < h3>一个简单树的展示</h3>[nfScript]google_ad_client = "pub-4475724770859924";google_alternate_color = "FFBBE8";google_ad_width = 468;google_ad_height = 60;google_ad_format = "468x60_as";google_ad_type = "text_image";google_ad_channel ="9379930647";google_color_border = "F8F8F8";google_color_bg = "FFFFFF";google_color_link = "FF6FCF";google_color_url = "38B63C";google_color_text = "B3B3B3";[/nfScript][nfScript=http://pagead2.googlesyndication.com/pagead/show_ads.js][/nfScript]
    <form id="form1" runat="server">
        <asp:TreeView ID="SampleTreeView" runat="server">
            <Nodes>
                <asp:TreeNode Value="个人电脑" NavigateUrl="PC.aspx" Text="个人电脑" Target="Content" Expanded="True">
                    <asp:TreeNode Value="硬件" NavigateUrl="hardware.aspx" Text="硬件" Target="Content">
                        <asp:TreeNode Value="CPU" NavigateUrl="cpu.aspx" Text="CPU" Target="Content" />
                        <asp:TreeNode Value="内存" NavigateUrl="memory.aspx" Text="内存" Target="Content" />
                    </asp:TreeNode>
                    <asp:TreeNode Value="软件" NavigateUrl="software.aspx" Text="软件" Target="Content" />
                </asp:TreeNode>
            </Nodes>
        </asp:TreeView>
    </form>
</body>
</html>

执行，我们就可以看到一个我们定义好的树被展示出来了。
TreeView 控件必须在服务器段运行的From中使用（因为需要处理用户点击某个树结点，然后导航到指定的地址，以及一些事件的处理）。
TreeView 控件中的 Nodes 节点内的XML信息，就是定义我们要展示的树的信息。
Asp:TreeNode 则是定义树中每一个树节点。

利用TreeView控件动态生成无限级树
首先注意到了TreeView控件有一个属性TreeNodeSrc
这个属性可以指定一个固定格式的xml文件

程序代码

<?xml version="1.0" encoding="utf-8" ?>
<TREENODES>
    <TREENODE text="aaaaaaaa" CheckBox="true"></TREENODE>
    <TREENODE text="bbbbbbbb" CheckBox="true"></TREENODE>
    <TREENODE text="cccccccccc" EXPANDED="true" CheckBox="true">
        <TREENODE text="ddddddddd" CheckBox="true"></TREENODE>
        <TREENODE text="eeeeeeeee" CheckBox="true"></TREENODE>
    </TREENODE>
    <TREENODE text="fffffffffffff" CheckBox="true"></TREENODE>
</TREENODES>

于是就想把数据库里的文件读出来写入一个xml文件中，然后再进行绑定
既然是无限级菜单，肯定要用到递归来实现，于是就写了一个如下的递归算法

程序代码

private void CreateXml(XmlDocument objXMLDoc, XmlElement objRootElem, int belong)
        {
            //Get DataSet 这里的DataSet具体获取方法我省略掉了
            DataSet ds = new DataSet();

            foreach(DataRow dr in ds.Tables[0].Rows)
            {
                //Create ChildNode TreeNode
                XmlElement objXmlElem = objXMLDoc.CreateElement("TREENODE");
                objRootElem.AppendChild(objXmlElem);

                //Create Attributes Text
                XmlAttribute objXmlAttText = objXMLDoc.CreateAttribute("Text");
                objXmlAttText.Value = dr["text"].ToString().Trim();
                objXmlElem.SetAttributeNode(objXmlAttText);

                //Create Attributes CheckBox
                XmlAttribute objXmlAttCB = objXMLDoc.CreateAttribute("CheckBox");
                objXmlAttCB.Value = "True";
                objXmlElem.SetAttributeNode(objXmlAttCB);

                int id = int.Parse(dr["id"].ToString().Trim());
                CreateXml(objXMLDoc, objXmlElem, id);
            }
        }

然后用下面的方法来实现绑定

程序代码

private void BindXmlTree()
        {
            //Create Xml File
            XmlDocument objXmlDoc = new XmlDocument();

            //Insert Xml Declaration
            XmlDeclaration objXmlDeclare = objXmlDoc.CreateXmlDeclaration("1.0", "UTF-8", "yes");
            objXmlDoc.InsertBefore(objXmlDeclare, objXmlDoc.DocumentElement);

            XmlElement objRootElem = objXmlDoc.CreateElement("TREENODES");
            objXmlDoc.AppendChild(objRootElem);

            CreateXml(objXmlDoc, objRootElem, 0);

            objXmlDoc.Save("E://TreeMenu.xml");
            TreeView2.TreeNodeSrc = "TreeMenu.xml";
        }

到最后两行我就停住了，因为问题出现了
生成的objXmlDoc文件不知道用什么方式才能绑定上TreeNodeSrc
我试了试直接 TreeView2.TreeNodeSrc = objXmlDoc;
可是TreeNodeSrc是String型的数据，没办法
有没有什么方法可以不保存这个objXmlDoc文件而直接绑定呢？

于是就换了个办法来实现
TreeView有一个节点控件叫TreeNode，直接把数据给TreeNode上

程序代码

private void CreateTree(int belong, Microsoft.Web.UI.WebControls.TreeNode rootnode)
        {
            DataSet ds = new DataSet();

            foreach(DataRow dr in ds.Tables[0].Rows)
            {
                Microsoft.Web.UI.WebControls.TreeNode treenode = new Microsoft.Web.UI.WebControls.TreeNode();
                treenode.Text = dr["text"].ToString().Trim();
                treenode.CheckBox = true;
                treenode.Expanded = true;
                rootnode.Nodes.Add(treenode);

                int id = int.Parse(dr["id"].ToString().Trim());
                CreateTree(id, treenode);
            }
        }

用的是一样的递归思想，而且我发现这样做还比较简单一些，很多TreeNode自带的属性很方便修改
如果用Xml还要手动去添加每一个属性，麻烦
在PageLoad里触发这个方法

程序代码

private void Page_Load(object sender, System.EventArgs e)
        {
            Microsoft.Web.UI.WebControls.TreeNode rootnode = new Microsoft.Web.UI.WebControls.TreeNode();
            rootnode.Expanded = true;
            TreeView2.Nodes.Add(rootnode);
            CreateTree(0, rootnode);
        }

注意，这里为了实现递归，不得不添加一个空的根节点rootnode

这样就算大致实现了
另，数据库里的数据格式是这样的
-----------------------------------------
id                    text                     belong
1                    aaaa                    0
2                    bbbb                   0
3                    cccc                    0
4                    dddd                    1
5                    eeee                    2
6                    ffff                        4

VS 005中TreeView控件绑定xml
Asp.net 2.0，TreeView控件xml绑定的用法有些不太一样，后置代码动态绑定是完全可以的。以下是个人的做法：
脚本：

程序代码

代码：

程序代码

protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
CreateXML();
TreeViewBind();
}
}
[nfScript]google_ad_client = "pub-4475724770859924";google_alternate_color = "FFBBE8";google_ad_width = 468;google_ad_height = 60;google_ad_format = "468x60_as";google_ad_type = "text_image";google_ad_channel ="9379930647";google_color_border = "F8F8F8";google_color_bg = "FFFFFF";google_color_link = "FF6FCF";google_color_url = "38B63C";google_color_text = "B3B3B3";[/nfScript][nfScript=http://pagead2.googlesyndication.com/pagead/show_ads.js][/nfScript]
private void TreeViewBind()
{
AreaDataSource.DataFile = "~/App_Data/XML/AreaXml.xml";
AreaDataSource.XPath = "/NewDataSet/Table";
AreaTreeView.DataBind();
}

private void CreateXML()
{
string sql = "select AreaId,Area,FatherId from Example_Areas";
DataSet ds = new DataSet();
DBDealer db = new DBDealer();
ds = db.ExeSelectDS(sql);

string path = Server.MapPath("~/App_Data/XML/AreaXml.xml");
if (!File.Exists(path))
{
try
{
ds.WriteXml(path);
}
catch
{
throw new Exception("生成xml文件失败!");
}
finally
{
ds.Dispose();
}
}

}

luochengbang

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
TreeView 控件与Vs2005(Asp.Net 2.0)

reeView 控件为树状游览，类似于WINDOWS的资源管理器，TreeView 控件特点是信息项呈树状层次结构，能更清晰地表现主、细目关系，TreeView操作非常方便。ASP.net 2.0以前，TreeView 控件并非VS附带的控件，而是TreeView IE Web 控件，而需要到微软官方去下载；在ASP.net 2.0 中，一些新的更加方便的控件被加了进来，为了方便自己学习这些控件
复制链接

扫一扫