How to determine which cell was clicked in as ASP.NET DataGrid

  • Thread starter Daniel Walzenbach
  • Start date
D

Daniel Walzenbach

Hi,



I created an ASP.NET Datagrid where a single row can be selected by clicking anywhere on the row (according to http://msdn.microsoft.com/library/d...QuestionsAboutASPNETDataGridServerControl.asp, Selecting Rows by Clicking Anywhere).



Private Sub DataGrid1_ItemDataBound(ByVal sender As Object, _
ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) _
Handles DataGrid1.ItemDataBound
Dim itemType As ListItemType = e.Item.ItemType
If ((itemType = ListItemType.Pager) Or _
(itemType = ListItemType.Header) Or _
(itemType = ListItemType.Footer)) Then
Return
Else
Dim button As LinkButton = _
CType(e.Item.Cells(0).Controls(0), LinkButton)
e.Item.Attributes("onclick") = _
Page.GetPostBackClientHyperlink(button, "")
End If
End Sub

Additionally I want to be able to know which cell was clicked. Does anybody know how this can be done?



Thank you a lot in advance!



Daniel
 
J

John Saunders

Hi,



I created an ASP.NET Datagrid where a single row can be selected by clicking anywhere on the row (according to http://msdn.microsoft.com/library/d...QuestionsAboutASPNETDataGridServerControl.asp, Selecting Rows by Clicking Anywhere).



Private Sub DataGrid1_ItemDataBound(ByVal sender As Object, _
ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) _
Handles DataGrid1.ItemDataBound
Dim itemType As ListItemType = e.Item.ItemType
If ((itemType = ListItemType.Pager) Or _
(itemType = ListItemType.Header) Or _
(itemType = ListItemType.Footer)) Then
Return
Else
Dim button As LinkButton = _
CType(e.Item.Cells(0).Controls(0), LinkButton)
e.Item.Attributes("onclick") = _
Page.GetPostBackClientHyperlink(button, "")
End If
End Sub

Additionally I want to be able to know which cell was clicked. Does anybody know how this can be done?



Thank you a lot in advance!




I'm not certain, but I think that if you use something other than "" for the second parameter to GetPostBackClientHyperlink, then the parameter will be passed as Request.Form("__EVENTARGUMENT").
 
S

Steven Cheng[MSFT]

Hi Daniel,

From your description, you've made the WebForm DataGrid fire the Select
Command when click anywhere on a datagrid row via the following tech
article:
http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dv_vstechar
t/html/vbtchTopQuestionsAboutASPNETDataGridServerControl.asp

I've read the above article and also generate some tests based on it. Since
the webform DataGrid is different from winform which doesn't provide
buildin means to get the current clicked cell because the Webform datagrid
is actually rendered out to clientside as a <table> ....</table> html
element. And each row of the dataGrid is a <tr> ...</tr>
each cell is a <td>... </td>

And in the article, it make use of the ItemDataBound event and add a
"onclick" clientside event for the DataGridItem Row so that when we click
on anywhere within a DataGrid Row , it'll fire the select command event.
However, the select command doesn't contain any information about which
Cell(Column) in the DataGrid row is clicked, yes?
I've tried John's suggestion on using the second param of the
Page.GetPostBackClientHyperlink(button, "") method , but found it won't
work for this issue.

Currently, my solution on this problem is still using the ItemDataBound
event, in addition to add and "onclick" clientside event for each
DataGridItem, we also have to add a "onclick" event functoin for each Cell
of the Item, forexample,
Dim col As Integer
For col = 0 To e.Item.Cells.Count - 1
e.Item.Cells(col).Attributes.Add("onclick",
"setCurrentColumn('" & col & "')")
Next

And the "setCurrentColumn" is a javascript function in the Page which set a
value to a <input type=hidden ..> elemetn in the page. You can see we use
this javascript to assign the current clicked Cell(<td>..</td>)'s columsn
index to the <input type=hidden ..> element. And we need to put the row
information of the currrent click Cell's Row index in the LinkButton's
CommandArgument as below:
Dim button As LinkButton = _
CType(e.Item.Cells(0).Controls(0), LinkButton)

Dim row As Integer = e.Item.ItemIndex
button.CommandArgument = row.ToString()


Then, in the DataGrid's ItemCommand event, we can get the current selected
Cell's row/col info like below:
Private Sub dgMain_ItemCommand(ByVal source As Object, ByVal e As
System.Web.UI.WebControls.DataGridCommandEventArgs) Handles
dgMain.ItemCommand
If e.CommandName = "Select" Then
Response.Write("<br>Row: " + e.CommandArgument)
Response.Write("<br>Col: " + hdCell.Value)

End If

End Sub


To make it clearly, I've pasted my test page's code at the bottom of this
message. Please refer to it if you have anything unclear. Thanks.

Regards,

Steven Cheng
Microsoft Online Support

Get Secure! www.microsoft.com/security
(This posting is provided "AS IS", with no warranties, and confers no
rights.)

Get Preview at ASP.NET whidbey
http://msdn.microsoft.com/asp.net/whidbey/default.aspx

========================aspx ==============================
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<title>CellGrid</title>
<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" content="Visual Basic .NET 7.1">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema"
content="http://schemas.microsoft.com/intellisense/ie5">
<script language="javascript">
function setCurrentColumn(col)
{
document.getElementById("hdCell").value = col;
}
</script>
</HEAD>
<body>
<form id="Form1" method="post" runat="server">
<table width="100%" align="center">
<tr>
<td></td>
</tr>
<tr>
<td>
<asp:DataGrid id="dgMain" runat="server" AutoGenerateColumns="False">
<Columns>
<asp:ButtonColumn Text="Select" HeaderText="Select"
CommandName="Select"></asp:ButtonColumn>
<asp:BoundColumn DataField="index"
HeaderText="Index"></asp:BoundColumn>
<asp:BoundColumn DataField="name"
HeaderText="Name"></asp:BoundColumn>
<asp:BoundColumn DataField="email"
HeaderText="Email"></asp:BoundColumn>
</Columns>
</asp:DataGrid></td>
</tr>
<tr>
<td><INPUT id="hdCell" type="hidden" name="hdCell" runat="server"
value="0|0"></td>
</tr>
</table>
</form>
</body>
</HTML>


===============code behind======================================
Public Class CellGrid
Inherits System.Web.UI.Page

#Region " Web Form Designer Generated Code "

'This call is required by the Web Form Designer.
<System.Diagnostics.DebuggerStepThrough()> Private Sub
InitializeComponent()

End Sub
Protected WithEvents dgMain As System.Web.UI.WebControls.DataGrid
Protected WithEvents hdCell As
System.Web.UI.HtmlControls.HtmlInputHidden

'NOTE: The following placeholder declaration is required by the Web
Form Designer.
'Do not delete or move it.
Private designerPlaceholderDeclaration As System.Object

Private Sub Page_Init(ByVal sender As System.Object, ByVal e As
System.EventArgs) Handles MyBase.Init
'CODEGEN: This method call is required by the Web Form Designer
'Do not modify it using the code editor.
InitializeComponent()
End Sub

#End Region

Private Sub Page_Load(ByVal sender As System.Object, ByVal e As
System.EventArgs) Handles MyBase.Load
If Not IsPostBack Then
Bind_Data()
End If
End Sub

Private Sub Bind_Data()
Dim tb As New DataTable("MyUser")
tb.Columns.Add("index", GetType(Integer))
tb.Columns.Add("name", GetType(String))
tb.Columns.Add("email", GetType(String))

Dim row As DataRow
Dim i As Integer
For i = 1 To 10
row = tb.NewRow()
row("index") = i
row("name") = "Name" + i.ToString()
row("email") = "Name" + i.ToString() + "@test.com"

tb.Rows.Add(row)
Next

dgMain.DataSource = tb
dgMain.DataBind()

End Sub

Private Sub dgMain_ItemDataBound(ByVal sender As Object, ByVal e As
System.Web.UI.WebControls.DataGridItemEventArgs) Handles
dgMain.ItemDataBound
Dim itemType As ListItemType = e.Item.ItemType
If ((itemType = ListItemType.Pager) Or _
(itemType = ListItemType.Header) Or _
(itemType = ListItemType.Footer)) Then
Return
Else
Dim button As LinkButton = _
CType(e.Item.Cells(0).Controls(0), LinkButton)

Dim row As Integer = e.Item.ItemIndex
button.CommandArgument = row.ToString()
e.Item.Attributes("onclick") = _
Page.GetPostBackClientHyperlink(button, "")

Dim col As Integer
For col = 0 To e.Item.Cells.Count - 1
e.Item.Cells(col).Attributes.Add("onclick",
"setCurrentColumn('" & col & "')")
Next

End If

End Sub

Private Sub dgMain_SelectedIndexChanged(ByVal sender As Object, ByVal e
As System.EventArgs) Handles dgMain.SelectedIndexChanged

End Sub

Private Sub dgMain_ItemCommand(ByVal source As Object, ByVal e As
System.Web.UI.WebControls.DataGridCommandEventArgs) Handles
dgMain.ItemCommand
If e.CommandName = "Select" Then
Response.Write("<br>Row: " + e.CommandArgument)
Response.Write("<br>Col: " + hdCell.Value)
'Response.Write("<br>CommandArgument: " + e.CommandArgument)
'Response.Write("<br>CommandSource: " +
e.CommandSource.ToString())
End If

End Sub
End Class
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,768
Messages
2,569,575
Members
45,053
Latest member
billing-software

Latest Threads

Top