C# : row-clickable GridView and get and set gridview rows using JavaScript
Complete C# code:
----------------
using System;
using System.ComponentModel;
using System.Configuration;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace CustomGridView
{
/// <summary> /// Summary description for ClickableGridView /// </summary> public class ClickableGridView : GridView
{
public string RowCssClass
{
get
{
string rowClass = (string)ViewState["rowClass"];
if (!string.IsNullOrEmpty(rowClass))
return rowClass;
else return string.Empty;
}
set
{
ViewState["rowClass"] = value;
}
}
public string HoverRowCssClass
{
get
{
string hoverRowClass = (string)ViewState["hoverRowClass"];
if (!string.IsNullOrEmpty(hoverRowClass))
return hoverRowClass;
else return string.Empty;
}
set
{
ViewState["hoverRowClass"] = value;
}
}
private static readonly object RowClickedEventKey = new object();
public event GridViewRowClicked RowClicked;
protected virtual void OnRowClicked(GridViewRowClickedEventArgs e)
{
if (RowClicked != null)
RowClicked(this, e);
}
protected override void RaisePostBackEvent(string eventArgument)
{
if (eventArgument.StartsWith("rc"))
{
int index = Int32.Parse(eventArgument.Substring(2));
GridViewRowClickedEventArgs args = new GridViewRowClickedEventArgs(Rows[index]);
OnRowClicked(args);
}
else base.RaisePostBackEvent(eventArgument);
}
protected override void PrepareControlHierarchy()
{
base.PrepareControlHierarchy();
for (int i = 0; i < Rows.Count; i++)
{
string argsData = "rc" + Rows[i].RowIndex.ToString();
Rows[i].Attributes.Add("onclick", Page.ClientScript.GetPostBackEventReference(this, argsData));
if (RowCssClass != string.Empty)
Rows[i].Attributes.Add("onmouseout", "this.className='" + RowCssClass + "';");
if (HoverRowCssClass != string.Empty)
Rows[i].Attributes.Add("onmouseover", "this.className='" + HoverRowCssClass + "';");
}
}
}
public class GridViewRowClickedEventArgs : EventArgs
{
private GridViewRow _row;
public GridViewRowClickedEventArgs(GridViewRow aRow)
: base()
{
_row = aRow;
}
public GridViewRow Row
{
get
{ return _row; }
}
}
public delegate void GridViewRowClicked(object sender, GridViewRowClickedEventArgs args);
}
I am having following example to access gridview rows and columns using JAVA Script. You
can call setCellValue to set the value of selected row/column cell.
<script language="javascript" type="text/javascript">
var gridViewCtlId = '<%=ctlGridView.ClientID%>';
var gridViewCtl = null;
var curSelRow = null;
var curRowIdx = -1;
function getGridViewControl()
{
if (null == gridViewCtl)
{
gridViewCtl = document.getElementById(gridViewCtlId);
}
}
function onGridViewRowSelected(rowIdx)
{
var selRow = getSelectedRow(rowIdx);
if (null != selRow)
{
curSelRow = selRow;
var cellValue = getCellValue(rowIdx, 0);
alert(cellValue);
}
}
function getSelectedRow(rowIdx)
{
return getGridRow(rowIdx);
}
function getGridRow(rowIdx)
{
getGridViewControl();
if (null != gridViewCtl)
{
return gridViewCtl.rows[rowIdx];
}
return null;
}
function getGridColumn(rowIdx, colIdx)
{
var gridRow = getGridRow(rowIdx);
if (null != gridRow)
{
return gridRow.cells[colIdx];
}
return null;
}
function getCellValue(rowIdx, colIdx)
{
var gridCell = getGridColumn(rowIdx, colIdx);
if (null != gridCell)
{
return gridCell.innerText;
}
return null;
}
function setCellValue(rowIdx, colIdx)
{
var gridCell = getGridColumn(rowIdx, colIdx);
gridCell.innerText = "Your value";
}
</script>
Regards
----------------
using System;
using System.ComponentModel;
using System.Configuration;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace CustomGridView
{
/// <summary> /// Summary description for ClickableGridView /// </summary> public class ClickableGridView : GridView
{
public string RowCssClass
{
get
{
string rowClass = (string)ViewState["rowClass"];
if (!string.IsNullOrEmpty(rowClass))
return rowClass;
else return string.Empty;
}
set
{
ViewState["rowClass"] = value;
}
}
public string HoverRowCssClass
{
get
{
string hoverRowClass = (string)ViewState["hoverRowClass"];
if (!string.IsNullOrEmpty(hoverRowClass))
return hoverRowClass;
else return string.Empty;
}
set
{
ViewState["hoverRowClass"] = value;
}
}
private static readonly object RowClickedEventKey = new object();
public event GridViewRowClicked RowClicked;
protected virtual void OnRowClicked(GridViewRowClickedEventArgs e)
{
if (RowClicked != null)
RowClicked(this, e);
}
protected override void RaisePostBackEvent(string eventArgument)
{
if (eventArgument.StartsWith("rc"))
{
int index = Int32.Parse(eventArgument.Substring(2));
GridViewRowClickedEventArgs args = new GridViewRowClickedEventArgs(Rows[index]);
OnRowClicked(args);
}
else base.RaisePostBackEvent(eventArgument);
}
protected override void PrepareControlHierarchy()
{
base.PrepareControlHierarchy();
for (int i = 0; i < Rows.Count; i++)
{
string argsData = "rc" + Rows[i].RowIndex.ToString();
Rows[i].Attributes.Add("onclick", Page.ClientScript.GetPostBackEventReference(this, argsData));
if (RowCssClass != string.Empty)
Rows[i].Attributes.Add("onmouseout", "this.className='" + RowCssClass + "';");
if (HoverRowCssClass != string.Empty)
Rows[i].Attributes.Add("onmouseover", "this.className='" + HoverRowCssClass + "';");
}
}
}
public class GridViewRowClickedEventArgs : EventArgs
{
private GridViewRow _row;
public GridViewRowClickedEventArgs(GridViewRow aRow)
: base()
{
_row = aRow;
}
public GridViewRow Row
{
get
{ return _row; }
}
}
public delegate void GridViewRowClicked(object sender, GridViewRowClickedEventArgs args);
}
I am having following example to access gridview rows and columns using JAVA Script. You
can call setCellValue to set the value of selected row/column cell.
<script language="javascript" type="text/javascript">
var gridViewCtlId = '<%=ctlGridView.ClientID%>';
var gridViewCtl = null;
var curSelRow = null;
var curRowIdx = -1;
function getGridViewControl()
{
if (null == gridViewCtl)
{
gridViewCtl = document.getElementById(gridViewCtlId);
}
}
function onGridViewRowSelected(rowIdx)
{
var selRow = getSelectedRow(rowIdx);
if (null != selRow)
{
curSelRow = selRow;
var cellValue = getCellValue(rowIdx, 0);
alert(cellValue);
}
}
function getSelectedRow(rowIdx)
{
return getGridRow(rowIdx);
}
function getGridRow(rowIdx)
{
getGridViewControl();
if (null != gridViewCtl)
{
return gridViewCtl.rows[rowIdx];
}
return null;
}
function getGridColumn(rowIdx, colIdx)
{
var gridRow = getGridRow(rowIdx);
if (null != gridRow)
{
return gridRow.cells[colIdx];
}
return null;
}
function getCellValue(rowIdx, colIdx)
{
var gridCell = getGridColumn(rowIdx, colIdx);
if (null != gridCell)
{
return gridCell.innerText;
}
return null;
}
function setCellValue(rowIdx, colIdx)
{
var gridCell = getGridColumn(rowIdx, colIdx);
gridCell.innerText = "Your value";
}
</script>
Regards
分类:
asp.net
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 【自荐】一款简洁、开源的在线白板工具 Drawnix