Use JQuery to call an asp:linkbutton click function

Question

I have been playing around with a search control and i have noticed that when you try and press enter from within the textbox it submits the form but doesnt click the search button (like i want it to).

My markup is:

<div>
    <span>Search</span>
    <asp:TextBox ID="txtSearch" runat="server" Width="170"
        onkeydown="if ((event.which && event.which == 13) || (event.keyCode && event.keyCode == 13)) {$('#<%=lkbSearch.ClientID %>').click();return false;} else return true; ">
    </asp:TextBox>
</div>
<asp:LinkButton ID="lkbSearch" runat="server" CssClass="searchButton">
    <asp:Image ID="imgSearch" runat="server" ImageUrl="~/Images/Master/button_go.gif" />
</asp:LinkButton>

i added the onkeydown event to the textboxes, and it runs, but when i try to use JQuery to call the Click() function from the button it does nothing.

How can i make it so when enter is pressed in the textbox it "clicks" the button?

Community · Accepted Answer · 2017-05-23 11:49:53Z

2

Since a LinkButton is added to the page as an <a>. When you select the button using jQuery you get the element wrapped in jQuery. Because of that calling the click event only triggers the click event, without following the href.

The following code would simulate clicking the button:

$('#<%= linkbuttonid.ClientID%>')[0].click();

You may replace '#<%= linkbuttonid.ClientID%>' with any selector that will get the correct element. But it is necessary to include [0] so that click is invoked on the <a> itself.

Alternately, you could reroute the page to the href:

window.location = $('yourselector').attr('href');

See this question for more information about invoking a click-event for an anchor tag in javascript.

edited May 23, 2017 at 11:49

CommunityBot

11 silver badge

answered Sep 5, 2013 at 13:27

Daniel

13.1k3 gold badges39 silver badges64 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Bennett Dill · Accepted Answer · 2009-04-06 03:55:30Z

1

This doesn't involve jQuery

Page.RegisterHiddenField( "__EVENTTARGET", lkbSearch.ClientID );

I see you're in a div, if you have a panel there's the DefaultButton attribute.

Failing that if you really want to use jQuery, you can use ClientScript.GetPostBackEventReference

Good luck :-)

answered Apr 6, 2009 at 3:55

Bennett Dill

2,9254 gold badges41 silver badges39 bronze badges

2 Comments

dkarzon Over a year ago

but wouldnt that mean i can only set it for that textbox across every page its used? I forgot to mention, this is inside a server control that in used on my master page (so its on every page of the site)

Bennett Dill Over a year ago

Yes, my code is for making it the default action. I think the panel & defaultbutton would still be ok and simple, or you can use the GetPostBackEventReference and call it when the keycode is the enter key.

dkarzon · Accepted Answer · 2009-04-06 04:38:22Z

0

After playing around with a few different things i finally came up with the solution.

I wrapped the textbox and button in an asp:panel control and set the default button to the ID of my LinkButton only to find that panels cant have LinkButtons as the DefaultButton.

But changing the link button to an ImageButton and using its ID in the DefaultButton filed of the panel works perfectly.

<asp:Panel ID="pnlSearch" runat="server" DefaultButton="imbSearch">
...
</asp:Panel>

edited Apr 6, 2009 at 4:38

answered Apr 6, 2009 at 4:25

dkarzon

8,05810 gold badges51 silver badges61 bronze badges

1 Comment

ACP Over a year ago

it doesn't work for me in firefox but works in ie and chrome. Any suggestion

Collectives™ on Stack Overflow

Use JQuery to call an asp:linkbutton click function

3 Answers 3

Comments

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related