Friday, 4 January 2013

TreeView and XmlDataSource Binding in asp.net using VB.NET

TreeView and XmlDataSource Binding in asp.net using VB.NET


Step 1) Create a Empty Asp.net website using VB.NET 4.0/4.5
Step 2) Add a new Webpage, name it as default.aspx
Step 3) Add Xml file called Books.xml

<?xml version="1.0" encoding="utf-8" ?>

<bookslist>
  <book id="ISBN-220-244">
    <title>LINQ Unleased</title>
    <price>$40.99</price>
    <authors>
      <author>
        <firstname>Kimmel </firstname>
        <lastname>Paul</lastname>
      </author>
    </authors>
    <publisher>Sams</publisher>
  </book>
  <book id="ISBN-456-344">
    <title>C# Design Patterns</title>
    <price>$30.99</price>
    <authors>
      <author>
        <firstname>john</firstname>
        <lastname>peter</lastname>
      </author>
      <author>
        <firstname>mary</firstname>
        <lastname>kurl</lastname>
      </author>
    </authors>
    <publisher>Tata Mcgraw Hill</publisher>
  </book>
  <book id="ISBN-434-233">
    <title>Pro Entity Framework 4.0</title>
    <price>29.99</price>
    <authors>
      <author>
        <firstname>Scott</firstname>
        <lastname>Klein</lastname>
      </author>
    </authors>
    <publisher>APress</publisher>
  </book>
  <book id="ISBN-433-234">
    <title>Beginning PHP and MySQL E-Commerce</title>
    <price>$35.99</price>
    <authors>
      <author>
        <firstname>Cristian</firstname>
        <lastname>Darie</lastname>
      </author>
      <author>
        <firstname>Emilian</firstname>
        <lastname>Balanescu</lastname>
      </author>
    </authors>
    <publisher>APress</publisher>
  </book>
</bookslist>


Step 4) Add Treeview and XmlDataSource to aspx page

  XMLDataSource datafile should be books.xml(step3) and xpath should be //book or /bookslist/book

<asp:TreeView ID="TreeView1"  runat="server" DataSourceID="XmlDataSource1" LineImagesFolder="~/TreeLineImages" OnSelectedNodeChanged="TreeView1_SelectedNodeChanged" ShowLines="True" ExpandDepth="0" >        </asp:TreeView>

<asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/data/Books.xml" XPath="//book"></asp:XmlDataSource>
//Datafile Located in data directory
//Bind XMLDataSource to TreeView using XMLDataSourceID.

Step 5) Add Event Handler for OnSelectedNodeChanged





        Protected  Sub TreeView1_SelectedNodeChanged(ByVal sender As Object, ByVal e As EventArgs)
            Try

                Dim node As TreeNode =  TreeView1.SelectedNode
               Dim str As String =  TreeView1.DataSourceID
               Dim xs As XmlDataSource = CType(FindControl(str), XmlDataSource)

                Dim doc As XmlDocument =  xs.GetXmlDocument()
                Dim nav As XPathNavigator =  doc.CreateNavigator()
                Dim parent As TreeNode = node.Parent
                Dim itr As XPathNodeIterator =  nav.Select(node.DataPath)


                While itr.MoveNext()
                    Label1.Text=String.Empty
                     Dim subitr As XPathNodeIterator =  itr.Current.SelectDescendants(XPathNodeType.Element,False)
                     If subitr.Count = 0 Then
                          Label1.Text = itr.Current.Name + ":" + itr.Current.Value
                     End If
                    While subitr.MoveNext()

                            Label1.Text += "<strong>" + subitr.Current.Name + "</strong>:" + subitr.Current.Value + "<br/>"
                    End While
                End While
            Catch ex As Exception
                Page.ErrorPage = "~/Error.aspx?err="+ex.Message
                Server.Transfer(Page.ErrorPage)
            End Try

        End Sub
 

Step 6) Run the Webpage default.aspx

Step 7) Click on ISBN-XXXX-XXX book details will be displayed in Label


















Complete Source Code

TreeView_Demo.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TreeView-Demo1.aspx.vb" Inherits="WebApplication1.TreeView_Demo1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        h1
        {
            background-color:navy;
            color:white;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
         <h1>TreeView &amp;XML DataSource Binding in asp.net</h1>
        <table>
            <tr>
                <td style="vertical-align:top">

        <asp:TreeView ID="TreeView1"  runat="server" DataSourceID="XmlDataSource1" LineImagesFolder="~/TreeLineImages"
            OnSelectedNodeChanged="TreeView1_SelectedNodeChanged"
            ShowLines="True" ExpandDepth="0"
            >
            <DataBindings>
                <asp:TreeNodeBinding DataMember="book"   Depth="0"  ValueField="ID"/>
                <asp:TreeNodeBinding DataMember="title"   Depth="1"       TextField="#InnerText"/>
                <asp:TreeNodeBinding DataMember="book"  Depth="1"    TextField="price" FormatString="{0:C}" />
                <asp:TreeNodeBinding DataMember="book"  Depth="2"    TextField="firstname" />
                <asp:TreeNodeBinding DataMember="book"  Depth="2"  TextField="lastname" />
                <asp:TreeNodeBinding DataMember="book" Depth="1"    TextField="publisher" />
               
            </DataBindings>
        </asp:TreeView>
                           

                </td>
                <td style="vertical-align:top">
                    <asp:UpdatePanel ID="UpdatePanel1" runat="server" UpdateMode="Always">
                        <ContentTemplate>

                     <asp:Label ID="Label1" runat="server" Text="Label" Font-Size="Larger" Width="500px" Height="300px" BackColor="teal" ForeColor="white"></asp:Label>
                                                    </ContentTemplate>
                    </asp:UpdatePanel>

                </td>
            </tr>
        </table>
  
      
        <asp:XmlDataSource ID="XmlDataSource1" runat="server" DataFile="~/data/Books.xml" XPath="//book"></asp:XmlDataSource>
    </div>
    </form>
</body>
</html>

TreeView_Demo.aspx.vb

Imports System
Imports System.Collections.Generic
Imports System.Linq
Imports System.Web
Imports System.Web.UI
Imports System.Web.UI.WebControls
Imports System.Xml
Imports System.Xml.XPath
Namespace WebApplication1
    Public partial Class TreeView_Demo1
     Inherits System.Web.UI.Page
        Protected  Sub Page_Load(ByVal sender As Object, ByVal e As EventArgs)

        End Sub

        Protected  Sub TreeView1_SelectedNodeChanged(ByVal sender As Object, ByVal e As EventArgs)
            Try

                Dim node As TreeNode =  TreeView1.SelectedNode
               Dim str As String =  TreeView1.DataSourceID
               Dim xs As XmlDataSource = CType(FindControl(str), XmlDataSource)

                Dim doc As XmlDocument =  xs.GetXmlDocument()
                Dim nav As XPathNavigator =  doc.CreateNavigator()
                Dim parent As TreeNode = node.Parent
                Dim itr As XPathNodeIterator =  nav.Select(node.DataPath)


                While itr.MoveNext()
                    Label1.Text=String.Empty
                     Dim subitr As XPathNodeIterator =  itr.Current.SelectDescendants(XPathNodeType.Element,False)
                     If subitr.Count = 0 Then
                          Label1.Text = itr.Current.Name + ":" + itr.Current.Value
                     End If
                    While subitr.MoveNext()

                            Label1.Text += "<strong>" + subitr.Current.Name + "</strong>:" + subitr.Current.Value + "<br/>"
                    End While
                End While
            Catch ex As Exception
                Page.ErrorPage = "~/Error.aspx?err="+ex.Message
                Server.Transfer(Page.ErrorPage)
            End Try

        End Sub

    End Class
End Namespace