locked
Change default button RRS feed

  • Question

  • User1510859543 posted

    We have an asp.net web page that has a default button (BtnSubmit) assigned so that if user presses the enter key it will submit the page and run the code behind that button.  We added a new search textbox with a 2nd button (BtnSearch) which we would like to make the default when the user types something into the textbox for the search.  How is that accomplished?

    Thursday, October 11, 2018 1:14 PM

Answers

  • User475983607 posted

    We have an asp.net web page that has a default button (BtnSubmit) assigned so that if user presses the enter key it will submit the page and run the code behind that button.  We added a new search textbox with a 2nd button (BtnSearch) which we would like to make the default when the user types something into the textbox for the search.  How is that accomplished?

    Use jQuery\JavaScript.

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DefaultButton.aspx.cs" Inherits="WebFormsApp.DefaultButton" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>
    </head>
    <body>
        <form id="form1" runat="server" DefaultButton="DefaultSubmit">
            <div>
                <asp:TextBox ID="Search" runat="server"></asp:TextBox>
                <asp:Button ID="SubmitSearch" runat="server" Text="Search" OnClick="SubmitSearch_Click" />
            </div>
            <div>
                <asp:Button ID="DefaultSubmit" runat="server" Text="Submit" OnClick="DefaultSubmit_Click" />
            </div>
            <div>
                <asp:Label ID="Label1" runat="server" Text="Nothing yet..."></asp:Label>
            </div>
        </form>
        <script>
            $("#<%=Search.ClientID%>").keydown(function (e) {
                //Stop the event bubbling
                e.preventDefault();
                if (e.keyCode == 13) //enter key while the search text box has the focus
                {
                    $("#<%=SubmitSearch.ClientID%>").click();
                }
            });
        </script>
    </body>
    </html>

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, October 11, 2018 2:18 PM
  • User-2054057000 posted

    dlchase

    This is not working when I have a master page.  Below is the relevant script and markup.  What am I doing wrong? Note that I added the alert to see if code was running and it did not pop up.

    When content page has a master page then the control id's change. Therefore apply the same code on css class and not id

    $(".search").keydown(function (e) {
        //Stop the event bubbling
        e.preventDefault();
        if (e.keyCode == 13) //enter key while the search text box has the focus
        {
            alert('click of IBtnSearch');
            $(".btnclass").click();
        }
    );
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, November 16, 2018 12:19 PM

All replies

  • User475983607 posted

    We have an asp.net web page that has a default button (BtnSubmit) assigned so that if user presses the enter key it will submit the page and run the code behind that button.  We added a new search textbox with a 2nd button (BtnSearch) which we would like to make the default when the user types something into the textbox for the search.  How is that accomplished?

    Use jQuery\JavaScript.

    <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="DefaultButton.aspx.cs" Inherits="WebFormsApp.DefaultButton" %>
    
    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>
    </head>
    <body>
        <form id="form1" runat="server" DefaultButton="DefaultSubmit">
            <div>
                <asp:TextBox ID="Search" runat="server"></asp:TextBox>
                <asp:Button ID="SubmitSearch" runat="server" Text="Search" OnClick="SubmitSearch_Click" />
            </div>
            <div>
                <asp:Button ID="DefaultSubmit" runat="server" Text="Submit" OnClick="DefaultSubmit_Click" />
            </div>
            <div>
                <asp:Label ID="Label1" runat="server" Text="Nothing yet..."></asp:Label>
            </div>
        </form>
        <script>
            $("#<%=Search.ClientID%>").keydown(function (e) {
                //Stop the event bubbling
                e.preventDefault();
                if (e.keyCode == 13) //enter key while the search text box has the focus
                {
                    $("#<%=SubmitSearch.ClientID%>").click();
                }
            });
        </script>
    </body>
    </html>

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, October 11, 2018 2:18 PM
  • User1510859543 posted

    This is not working when I have a master page.  Below is the relevant script and markup.  What am I doing wrong? Note that I added the alert to see if code was running and it did not pop up.

    In my script block of master page
    
            $("#txtROSearch").keydown(function (e) {
                //Stop the event bubbling
                e.preventDefault();
                if (e.keyCode == 13) //enter key while the search text box has the focus
                {
                    alert('click of IBtnSearch');
                    $("#IBtnSearch").click();
                }
            });
    
    aspx page markup controls
    
    <asp:TextBox ID="txtROSearch" runat="server" ClientIDMode="Static"  AutoPostBack="False"></asp:TextBox>
    
    <asp:ImageButton ID="IBtnSearch" runat="server" ImageUrl="~/images/searchButton.gif" CausesValidation="False" ClientIDMode="Static" />
    

    Friday, October 19, 2018 1:47 PM
  • User-2054057000 posted

    dlchase

    This is not working when I have a master page.  Below is the relevant script and markup.  What am I doing wrong? Note that I added the alert to see if code was running and it did not pop up.

    When content page has a master page then the control id's change. Therefore apply the same code on css class and not id

    $(".search").keydown(function (e) {
        //Stop the event bubbling
        e.preventDefault();
        if (e.keyCode == 13) //enter key while the search text box has the focus
        {
            alert('click of IBtnSearch');
            $(".btnclass").click();
        }
    );
    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, November 16, 2018 12:19 PM