ASP.NET gridview row onclick

I’m attempting to have an onclick event added to a row once the data is bound to a gridview webcontrol. The code below is not adding any attributes (checked the viewsource once the page is created) and, of course, no functionality is added. Right now, I’ve just got the onclick printing to the page, but eventually it will link to another page. Any ideas on what’s wrong?

Also, thanks to the stackoverflow community at large. This community has always been a great help. Plan to go through some posts myself this weekend and start answering questions as I can to give back a bit.

C# server-side

protected void dataTbl_RowDataBound(GridViewRowEventArgs e){
            e.Row.Attributes.Add("id",e.Row.Cells[0].Text);
            e.Row.Attributes.Add("onclick", "rowClick('"+e.Row.RowIndex+"')");

        }

Javascript client-side
function rowClicked(counter){
    document.write(counter);
}

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

I’m using this in the RowDataBound of my GridView, to add the attribute to select the row:

protected void grvSearch_RowDataBound(object sender, GridViewRowEventArgs e)
{
    try
    {
        switch (e.Row.RowType)
        {
            case DataControlRowType.Header:
                //...
                break;
            case DataControlRowType.DataRow:
                e.Row.Attributes.Add("onmouseover", "this.style.backgroundColor='#93A3B0'; this.style.color='White'; this.style.cursor='pointer'");
                if (e.Row.RowState == DataControlRowState.Alternate)
                {
                    e.Row.Attributes.Add("onmouseout", String.Format("this.style.color='Black';this.style.backgroundColor='{0}';", grvSearch.AlternatingRowStyle.BackColor.ToKnownColor()));
                }
                else
                {
                    e.Row.Attributes.Add("onmouseout", String.Format("this.style.color='Black';this.style.backgroundColor='{0}';", grvSearch.RowStyle.BackColor.ToKnownColor()));
                }
                e.Row.Attributes.Add("onclick", Page.ClientScript.GetPostBackEventReference(grvSearch, "Select$" + e.Row.RowIndex.ToString()));
                break;
        }
    }
    catch 
    {
        //...throw
    }
}

And this to catch de event when an user click the row:
protected void grvSearch_SelectedIndexChanged(object sender, EventArgs e)
{
    try
    {
        //Do wherever you want with grvSearch.SelectedIndex                
    }
    catch
    {
        //...throw
    }
}

Method 2

To do this in jQuery, simply get the row click event like this:

$(document).ready(function () {
    var clickCnt = 0;
    $('table tr').click(function(){
        clickCnt++;
        //Do something 
    });
});

With that, I recommend setting the TR ID to the primary key to the object that is displayed in the row.

Method 3

Is the Grid set up to call dataTbl_RowDataBound event? If you debug with a breakpoint in that event, does that event get fired?

Method 4

You can use rowcommand event if it’s not working.
http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.gridview.rowcommand.aspx


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x