Hello All,
Today I am showing an interesting block of code which will help you in applying user search on a tree view control of asp.net applications.
Prerequisites
For this you have to create an asp.net demo project using language C#
Action:
Step 1: Now Create a web page with name TreeViewS.aspx .
Step 2: Now Paste the below code there.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="TreeViewS.aspx.cs" Inherits="webUI_TreeViewS" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Abhishek TreeView FindNode</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<h3>
TreeView FindNode Using User Input</h3>
<strong>Search Criteria:</strong>(Use a forward slash (/) to delimit each node value.)<br />
<asp:TextBox ID="ValueText" runat="server" Text="Table/Example One/Section 1.0"
Width="50%"></asp:TextBox>
<br />
<br />
<asp:Button ID="Submit" runat="server" OnClick="Button_Click" Text="Find Node" />
<br />
<br />
<asp:TreeView ID="MainTree" runat="server" Font-Names="Arial" ForeColor="Blue" PathSeparator="/">
<LevelStyles>
<asp:TreeNodeStyle ChildNodesPadding="10" Font-Bold="true" Font-Size="12pt" ForeColor="DarkGreen" />
<asp:TreeNodeStyle ChildNodesPadding="5" Font-Bold="true" Font-Size="10pt" />
<asp:TreeNodeStyle ChildNodesPadding="5" Font-Size="10pt" Font-Underline="true" />
<asp:TreeNodeStyle ChildNodesPadding="10" Font-Size="8pt" />
</LevelStyles>
<Nodes>
<asp:TreeNode SelectAction="None" Text="Table">
<asp:TreeNode Text="Example One" Value="Example One">
<asp:TreeNode Text="Section 1.0" Value="Section 1.0">
<asp:TreeNode Text="Topic 1.0.1" Value="Topic 1.0.1"></asp:TreeNode>
<asp:TreeNode Text="Topic 1.0.2" Value="Topic 1.0.2"></asp:TreeNode>
<asp:TreeNode Text="Topic 1.0.3" Value="Topic 1.0.3"></asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text="Section 1.1">
<asp:TreeNode Text="Topic 1.1.1" Value="Topic 1.1.1"></asp:TreeNode>
<asp:TreeNode Text="Topic 1.1.2" Value="Topic 1.1.2"></asp:TreeNode>
<asp:TreeNode Text="Topic 1.1.3" Value="Topic 1.1.3"></asp:TreeNode>
<asp:TreeNode Text="Topic 1.1.4" Value="Topic 1.1.4"></asp:TreeNode>
</asp:TreeNode>
</asp:TreeNode>
<asp:TreeNode Text="Example Two" Value="Example Two">
<asp:TreeNode Text="Section 2.0" Value="Section 2.0">
<asp:TreeNode Text="Topic 2.0.1" Value="Topic 2.0.1"></asp:TreeNode>
<asp:TreeNode Text="Topic 2.0.2" Value="Topic 2.0.2"></asp:TreeNode>
</asp:TreeNode>
</asp:TreeNode>
</asp:TreeNode>
</Nodes>
</asp:TreeView>
</div>
</form>
</body>
</html>
Step 3: Now paste the below C# code in your web page code file (.CS) file.
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Drawing;
public partial class webUI_TreeViewS : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
MainTree.SelectedNodeStyle.ForeColor = Color.Red;
}
}
protected void Button_Click(object sender, EventArgs e)
{
try
{
TreeNode node = MainTree.FindNode(Server.HtmlEncode(ValueText.Text.Trim()));
if (node != null)
{
node.Select();
ValueText.Text = "";
}
else
{
ValueText.Text = "The specified node (" + ValueText.Text + ") is not in this TreeView control.";
}
}
catch (Exception ex)
{
throw ex;
}
}
}
Now set this page as start page , then compile and run the project.
:)
Now Type the name of node for search the node will be selected autometicaly in tree list.
Have Fun :laugh:
Presently Abhishek is working as an Senior Software Developer in Youngtech Pvt. Ltd.(Division of Youngsoft Inc.).Abhishek have 9 years hands on asp.net and various database handling experiences. Presently he is engage in creation of an application to handle online database services.
Submit an article or tip
