How to show Record Hierarchical Way in Grid View
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="haryrchygrid.aspx.cs" Inherits="haryrchygrid" %>
<!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>Untitled Page</title>
<script type ="text/javascript">
var curval = -1,;
function showhiderowbyrow(obj) {
obj++;
curval = -1;
var grid = document.getElementById("GridView1");
var gc = grid.rows.length;
for (var rw = obj; rw < gc; rw++) {
if (grid.rows[rw].cells[2].innerText.replace(" ","") == 'p') {
curval++;
if (curval == 0) {
grid.rows[rw].style.display = "block";
document.getElementById('divimg' + (rw - 1).toString()).style.display = "block";
var im = document.getElementById('img' + (rw-1).toString()).src;
if (im.indexOf("p.gif") > 0) {
document.getElementById('img' + (rw - 1).toString()).src = "images/m.gif";
grid.rows[rw].style.display = "block";
}
else if (im.indexOf("m.gif") > 0) {
document.getElementById('img' + (rw - 1).toString()).src = "images/p.gif";
grid.rows[rw].style.display = "block";
}
}
}
else if (grid.rows[rw].cells[2].innerText.replace(" ", "") == 'c') {
if (curval == 0) {
var im = document.getElementById('img' + (obj - 1).toString()).src;
document.getElementById('divimg' + (rw - 1).toString()).style.display = "none";
if (im.indexOf("p.gif") > 0) {
grid.rows[rw].style.display = "none";
}
else if (im.indexOf("m.gif") > 0) {
grid.rows[rw].style.display = "block";
}
}
}
}
}
function showallrow() {
var grid = document.getElementById("GridView1");
var gc = grid.rows.length;
var hdim = document.getElementById("imgheader").src ;
if (hdim.indexOf("p.gif") > 0) {
document.getElementById("imgheader").src = "images/m.gif";
for (var rw = 1; rw < gc; rw++) {
var inrtxt = grid.rows[rw].cells[3].innerText;
if (inrtxt.replace(" ", "") == "0") {
document.getElementById('divimg' + (rw - 1).toString()).style.display = "block";
var im = document.getElementById('img' + (rw - 1).toString()).src;
if (im.indexOf("p.gif") > 0) {
document.getElementById('img' + (rw - 1).toString()).src = "images/m.gif";
}
//
}
else {
document.getElementById('divimg' + (rw - 1).toString()).style.display = "none";
}
grid.rows[rw].style.display = "block";
}
}
else {
document.getElementById("imgheader").src = "images/p.gif";
for (var rw = 1; rw < gc; rw++) {
var inrtxt = grid.rows[rw].cells[3].innerText;
if (inrtxt.replace(" ", "") == "0") {
//
document.getElementById('divimg' + (rw - 1).toString()).style.display = "block";
var im = document.getElementById('img' + (rw - 1).toString()).src;
//
if (im.indexOf("m.gif") > 0) {
document.getElementById('img' + (rw - 1).toString()).src = "images/p.gif";
}
grid.rows[rw].style.display = "block";
}
else {
document.getElementById('divimg' + (rw - 1).toString()).style.display = "none";
grid.rows[rw].style.display = "none";
}
}
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
<asp:GridView ID="GridView1" runat="server"
onrowdatabound="GridView1_RowDataBound" AutoGenerateColumns="false" GridLines="Horizontal">
<Columns>
<asp:TemplateField>
<HeaderTemplate>
<a href ='Javascript:showallrow();' id="hyperheader"> <img id="imgheader" alt ="" height="19px" src="images/p.gif" / ></a>
</HeaderTemplate>
<ItemTemplate>
<div id ="divimg<%# Container.DataItemIndex %>" style="height :30px; width :20px;">
<a href ='Javascript:showhiderowbyrow("<%# Container.DataItemIndex %>");' id='imga<%# Container.DataItemIndex %>'> <img id='img<%# Container.DataItemIndex %>' height="19px" alt ="" src="images/p.gif" /></a></div>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText ="Category Name">
<ItemTemplate>
<asp:Label ID="lblcatename" Text ='<%# Eval("CategorName") %>' runat ="server" ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText ="Relation">
<ItemTemplate>
<asp:Label ID="lblRelation" Text ='<%# Eval("Relation") %>' runat ="server" ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText ="Lvel">
<ItemTemplate>
<asp:Label ID="lblLvel" Text ='<%# Eval("Lvel") %>' runat ="server" ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText ="Relation_id">
<ItemTemplate>
<asp:Label ID="lblRelation_id" Text ='<%# Eval("Relation_id") %>' runat ="server" ></asp:Label>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</form>
</body>
</html>
C# Code
using System;
using System.Collections;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.Data.SqlClient;
public partial class haryrchygrid : System.Web.UI.Page
{
SqlConnection con=new SqlConnection (ConfigurationManager.ConnectionStrings ["employyeeConnectionString"].ConnectionString );
SqlCommand com;
DataSet ds;
SqlDataAdapter da;
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack)
{
da = new SqlDataAdapter("Exec [sp_hyrarchyoftable]", con.ConnectionString);
ds = new DataSet();
da.Fill(ds);
GridView1.DataSource = ds.Tables[0];
GridView1.DataBind();
}
}
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.Header)
{
e.Row.Style.Add("background-color", "#DC143C");
}
else if (e.Row.RowType == DataControlRowType.DataRow)
{
if (((Label)e.Row.Cells[3].Controls[1]).Text != "0")
{
e.Row.Style.Add("display", "none");
e.Row.Style.Add("background-color", "#ECF1EF");
}
else
{
//System.Drawing.Color.Maroon
e.Row.Style.Add("background-color", "#8A2BE2");
}
}
}
}
--syntex for creating Table named hyrarchy
create table hyrarchy(id int primary key identity(1,1),catname
varchar(50),rel varchar(1),lev int,relid int)
--syntex for Inserting Data in Table named hyrarchy
insert into hyrarchy(catname ,rel,lev ,relid) values('Student','p',0,0)
insert into hyrarchy(catname ,rel,lev ,relid) values('Book','c',1,1)
insert into hyrarchy(catname ,rel,lev ,relid) values('Pencil','c',2,1)
insert into hyrarchy(catname ,rel,lev ,relid) values('School','p',0,0)
insert into hyrarchy(catname ,rel,lev ,relid) values('Teacher','c',1,4)
insert into hyrarchy(catname ,rel,lev ,relid) values('Class','c',2,4)
insert into hyrarchy(catname ,rel,lev ,relid) values('Copy','c',3,1)
insert into hyrarchy(catname ,rel,lev ,relid) values('Principle','c',3, 4)
insert into hyrarchy(catname ,rel,lev ,relid) values('Bag', 'c',4,1)
insert into hyrarchy(catname ,rel,lev ,relid) values('Note Book','c',5,1)
insert into hyrarchy(catname ,rel,lev ,relid) values('Black Board', 'c',4,4)
insert into hyrarchy(catname ,rel,lev ,relid) values('Project Manager','p',0,0)
insert into hyrarchy(catname ,rel,lev ,relid) values('Team Leader','c',1,12)
insert into hyrarchy(catname ,rel,lev ,relid) values('Developer','c',2,12)
insert into hyrarchy(catname ,rel,lev ,relid) values('Programmer','c',3,12)
insert into hyrarchy(catname ,rel,lev ,relid) values('Designer','c',4,12)
insert into hyrarchy(catname ,rel,lev ,relid) values('Codder','c',5,12)
CREATE proc [dbo].[sp_hyrarchyoftable]
as
begin
--syntex for declaring variables
declare @id int
declare @catname varchar(50)
declare @rel varchar(1)
declare @lev int
declare @relid int
declare @catnemrel varchar(100)
--syntex for declare cursor
declare cursorforlevel cursor fast_forward for select id,catname,rel,lev,relid from hyrarchy where relid=0
--syntex for open cursor
open cursorforlevel
--syntex for create temporary table
create table #temp1(id int,CategorName varchar(50),Relation varchar(1),Lvel int,Relation_id int,)
--fetching data row by row
fetch next from cursorforlevel into @id,@catname,@rel,@lev,@relid
--checking all rows are fetched
while @@FETCH_STATUS=0
begin
--fetched row data are inserted into temp table #temp1
insert into #temp1 values(@id,@catname,@rel,@lev,@relid)
--syntex for declare cursor
declare cursorforlevel1 cursor fast_forward for select id,catname,rel,lev,relid from hyrarchy where relid=@id
--syntex for open cursor
open cursorforlevel1
--fetching data row by row
fetch next from cursorforlevel1 into @id,@catname,@rel,@lev,@relid
--checking all rows are fetched
while @@FETCH_STATUS=0
begin
--fetched row data are inserted into temp table #temp1
insert into #temp1 values(@id,@catname,@rel,@lev,@relid)
--move data fetching in next row if all row data not fetched
fetch next from cursorforlevel1 into @id,@catname,@rel,@lev,@relid
end
close cursorforlevel1
deallocate cursorforlevel1
fetch next from cursorforlevel into @id,@catname,@rel,@lev,@relid
end
close cursorforlevel
deallocate cursorforlevel
select CategorName,Relation,Lvel,Relation_id from #temp1
end
3 comments:
nice job Ramu sir...................
Thanks Dear
Carry On
Display hierarchical GridView automatically
Post a Comment