GridView控件点击单元格如何获取该列的列标题

本博文Insus.NET教你实现在GridView控件中,用mouse点击某单元格之后,希望能获取到该列的列标题。

创建一个网页,创建一个GridView控件:



去cs绑定数据给GridView控件:



下面我们需要写注册click事件,以便获取被点击的行或列索引。在网页中override Render()方法,为cell添加attributes “onclick”事件。



现在我们需要为GridView控件添加一个事件,添加一个Label,用来显示所获取的列名。
去.aspx的html markup:




去.aspx.cs写OnRowCommand="GridViewFruit_RowCommand"事件:



实时操作演示:


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要实现这样的功能,可以使用GridView控件的内置事件和属性。具体步骤如下: 1. 在GridView控件中设置属性`AutoGenerateColumns="false"`,手动添加。 2. 为GridView控件绑定数据源。 3. 为GridView控件添加事件`RowDataBound`,在事件中为每一行的单元格添加`onkeydown`事件。 ```aspx <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" OnRowDataBound="GridView1_RowDataBound"> <Columns> <asp:BoundField DataField="Name" HeaderText="Name" /> <asp:BoundField DataField="Age" HeaderText="Age" /> <asp:BoundField DataField="Gender" HeaderText="Gender" /> </Columns> </asp:GridView> ``` ```csharp protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { // 绑定数据源 GridView1.DataSource = GetData(); GridView1.DataBind(); } } protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e) { if (e.Row.RowType == DataControlRowType.DataRow) { // 为每一行的单元格添加onkeydown事件 foreach (TableCell cell in e.Row.Cells) { cell.Attributes.Add("onkeydown", "return MoveNextCell(event)"); } } } private DataTable GetData() { // 模拟数据 DataTable dt = new DataTable(); dt.Columns.Add("Name"); dt.Columns.Add("Age"); dt.Columns.Add("Gender"); dt.Rows.Add("Tom", "20", "Male"); dt.Rows.Add("Jerry", "18", "Female"); dt.Rows.Add("Alice", "22", "Female"); return dt; } ``` 4. 编写JavaScript函数`MoveNextCell`,在函数中判断按下的键是否是回车键,如果是则获取当前单元格的行和,然后焦点移动到下一行同一单元格。 ```javascript function MoveNextCell(e) { var keyCode = e.keyCode ? e.keyCode : e.which ? e.which : e.charCode; if (keyCode == 13) { // 回车键 var currentCell = e.srcElement || e.target; var currentRow = currentCell.parentNode.parentNode; var currentRowIndex = currentRow.rowIndex; var currentCellIndex = currentCell.cellIndex; var nextRow = currentRow.nextSibling; while (nextRow) { // 查找下一行 if (nextRow.nodeType == 1) { var nextCell = nextRow.cells[currentCellIndex]; if (nextCell) { // 如果存在同一单元格 nextCell.focus(); break; } } nextRow = nextRow.nextSibling; } return false; } return true; } ``` 通过以上步骤,就可以实现在GridView控件获取当前单元格的焦点,按回车会获取下一行同一单元格焦点的功能了。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值