Posts Tagged ‘Row Clickable’

Row Clickable GridView

March 18, 2008

Steps for creating Web Control Library

from VS IDE Select FIle>New> Project >WebControlLibrary

As in following Image :

Web Control Lib


Try this code for creating Row Clickable GridView control to cs file:

//Author:Nissan .K. George
//Web Developer
//nissankg@yahoo.com
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.SqlClient;
using System.Drawing;
namespace RowClickableGridView
{

[ToolboxData(“<{0}:DBGridView runat=server></{0}:DBGridView>”)]
public partial class DBGridView : System.Web.UI.WebControls.GridView
{
#region “Properties”

[Bindable(true)]
[Category(“Appearance”)]
[DefaultValue(“”)]
[Localizable(true)]
public Color RowHoverColor
{
get
{
// look for hover color in ViewState
object o = ViewState[“RowHoverColor”];
if (o == null)
return Color.Empty;
else
return (Color)o;
}

set
{
ViewState[“RowHoverColor”] = value;
}
}

#endregion

#region Members overrides

public DBGridView() : base() { }

protected override void PrepareControlHierarchy()
{
base.PrepareControlHierarchy();

// Add a click handler to each row
for (int i = 0; i < this.Rows.Count; i++)
{
string argument = “rowClicked:” + i;
this.Rows[i].Attributes.Add(“onclick”, Page.ClientScript.GetPostBackEventReference(this, argument));

if (!(this.RowHoverColor.IsEmpty))
{

Rows[i].Attributes.Add(“onmouseover”,
(“this.style.backgroundColor='” + String.Format(“#{0:x2}{1:x2}{2:x2}”, this.RowHoverColor.R, this.RowHoverColor.G, this.RowHoverColor.B) + “‘;”));
if (!(this.BackColor.IsEmpty))
{
Rows[i].Attributes.Add(“onmouseout”,
(“this.style.backgroundColor='” + String.Format(“#{0:x2}{1:x2}{2:x2}”, this.BackColor.R, this.BackColor.G, this.BackColor.B) + “‘;”));
}
else { Rows[i].Attributes.Add(“onmouseout”, “this.style.backgroundColor=\’\’;”); }
}
}
if (this.SelectedIndex != -1)
{
string argument = “Edited:” + SelectedIndex.ToString();
Rows[this.SelectedIndex].Attributes.Remove(“onmouseover”);
Rows[this.SelectedIndex].Attributes.Remove(“onmouseout”);
this.Rows[this.SelectedIndex].Attributes.Remove(“onclick”);
this.Rows[this.SelectedIndex].Attributes.Add(“onblur”, Page.ClientScript.GetPostBackEventReference(this, argument));

}
}

protected override void RaisePostBackEvent(string eventArgument)
{
// Only override “rowClicked” post-backs
if (eventArgument.StartsWith(“rowClicked:”))
{
eventArgument = eventArgument.Remove(0, 11);
int row = int.Parse(eventArgument);
this.SelectedIndex = row;
this.OnSelectedIndexChanged(new EventArgs());

this.EditIndex = row;

}

else
{
base.RaisePostBackEvent(eventArgument);
}
}

protected override void OnSelectedIndexChanged(EventArgs e)
{
this.Rows[this.SelectedIndex].Attributes.Remove(“rowClicked”);
int row=-1;
row = this.SelectedIndex ;

}

protected override void OnInit(EventArgs e)
{
base.OnInit (e);

}
#endregion

}
}

after creating control add dll to toolkit then drag into page use following code :

<%@ Page Language=”C#” AutoEventWireup=”true” CodeFile=”Default.aspx.cs” Inherits=”_Default” %>

<%@ Register Assembly=”RowClickableGridView” Namespace=”RowClickableGridView” TagPrefix=”cc2″ %>

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”&gt;

<html xmlns=”http://www.w3.org/1999/xhtml&#8221; >
<head runat=”server”>
<title>Untitled Page</title>
</head>
<body>
<form id=”form1″ runat=”server”>

<asp:SqlDataSource ID=”SqlDataSource1″ runat=”server” ConnectionString=”<%$ ConnectionStrings:GboxConnectionString %>”
SelectCommand=”SELECT [AssetTypeId], [AssetTypeName] FROM [AssetTypes]” UpdateCommand=”UPDATE AssetTypes SET AssetTypeName = @AssetTypeName where AssetTypeid=@AssetTypeId”>
<UpdateParameters>
<asp:ControlParameter ControlID=”DBGridView1″ Name=”AssetTypeName” PropertyName=”SelectedValue” />
<asp:ControlParameter ControlID=”DBGridView1″ Name=”AssetTypeId” PropertyName=”SelectedValue” />
</UpdateParameters>
</asp:SqlDataSource>

<cc2:DBGridView ID=”DBGridView1″ runat=”server” AutoGenerateColumns=”False” DataKeyNames=”AssetTypeId”
DataSourceID=”SqlDataSource1″ AutoGenerateDeleteButton=”True” AutoGenerateEditButton=”True” RowHoverColor=”255, 192, 192″>
<Columns>
<asp:BoundField DataField=”AssetTypeId” HeaderText=”AssetTypeId” InsertVisible=”False”
ReadOnly=”True” SortExpression=”AssetTypeId” />
<asp:BoundField DataField=”AssetTypeName” HeaderText=”AssetTypeName” SortExpression=”AssetTypeName” />
</Columns>
<EditRowStyle BackColor=”Red” />
</cc2:DBGridView>
</form>
</body>
</html>
then run it and test it

Row Clickable Grid