asked on

How to handle enter on button in Gridview

Good Morning,

I have this : onkeydown="if ((event.which && event.which == 13) ||
(event.keyCode && event.keyCode == 13))
{document.aspnetForm.btnSearch.click();return false;}
else return true;"

in a usercontrol to handle enter and it works perfect. I want to add the above in the codebehind of a gridview that dynamically adds a button onrowbound to every row. I know how to add the above using attributes.add. What I need help with is how to figure out what the name of the button is on each row?

Bottom line is I need to handle enter for each row in this gridview. Thanks.

Kiran Sonawane

Add like this

btn.Attributes.Add("onkeyup","if ((event.which && event.which == 13) || (event.keyCode && event.keyCode == 13)){document.aspnetForm.btnSearch.click();return false;} else return true;");

ASKER CERTIFIED SOLUTION

Carlos Villegas

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

thamilto0410

ASKER

yv989c: That worked like a charm. Thanks so much. One more question. If I were going to pass the clicked record to an update procedure. How do I get each of the buttons to call the same procedure and pass the record data back to it?

Carlos Villegas

Hello, I dont know exactly what you are doing, but handling an event from a dynamically created control inside a GridView is more complicated, especially if you want to attach a piece of data of the GridView row that contain it, why you not use just a template?, see the next example, I'm using a template and handling the enter key as you want:

<%@ Import Namespace="System.Data" %>

<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            // Sample data...
            DataTable dtt = new DataTable();
            dtt.Columns.Add("ColumnA", typeof(int));
            dtt.Rows.Add(1);
            dtt.Rows.Add(2);
            dtt.Rows.Add(3);
            GridView1.DataSource = dtt;
            GridView1.DataBind();
        }
    }

    protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
    {
        if (e.CommandName == "Save")
        {
            Button myButton = (Button)e.CommandSource;
            GridViewRow myRow = (GridViewRow)myButton.NamingContainer;

            TextBox myTextBox = (TextBox)myRow.FindControl("MyTextBox");
            int myKey = (int)GridView1.DataKeys[myRow.DataItemIndex]["ColumnA"];

            // Here you can save your values to a DB
            Response.Write("Key: " + myKey + "<br/>Text: " + myTextBox.Text + "<br/>");
        }
    }

    protected override void Render(HtmlTextWriter writer)
    {
        foreach (GridViewRow row in GridView1.Rows)
        {
            row.Attributes.Add("onkeydown", "saveRecord('" + row.FindControl("MyButton").ClientID + "');");
        }

        base.Render(writer);
    }
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script type="text/javascript">
        function saveRecord(controlId) {
            if ((event.which && event.which == 13) || (event.keyCode && event.keyCode == 13))
                document.getElementById(controlId).click();
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataKeyNames="ColumnA"
        OnRowCommand="GridView1_RowCommand">
        <Columns>
            <asp:TemplateField HeaderText="My Column">
                <ItemTemplate>
                    <asp:TextBox runat="server" ID="MyTextBox" />
                    <asp:Button runat="server" ID="MyButton" Text="Save" CommandName="Save" UseSubmitBehavior="false" />
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
    </asp:GridView>
    </form>
</body>
</html>

Open in new window

Here the full aspx page:
Test5.aspx

I hope this helps.

thamilto0410

ASKER

yv989c: I have a gridview that displays data and allows a note to be added to the record with a textbox and a button. The button click event works fine but I wanted to handle the button as if the enter key was used instead. I don't think I can use the above as my gridview is built completely at run time.

thamilto0410

ASKER

yv989c: Never mind I figured it out using rowcommand. You answered my question on how to name the button. Thanks so much.

thamilto0410

ASKER

I learned something new. Thanks so much.

Carlos Villegas

Glad to have been of help