LinkButton does not invoke on click()

Why doesn’t this work?

    <script src="Scripts/jquery-1.3.2.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('.myButton').click();
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:LinkButton id="ttt" runat="server" PostBackUrl="~/Default.aspx" CssClass="myButton">Click</asp:LinkButton>
    </div>
    </form>

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

Do you want to submit the form, or add a Click event?
Your link button translates to

<a id="ttt" class="myButton" href="javascript:WebForm_DoPos[...]" rel="nofollow noreferrer noopener">Click</a>

, so it has no on-click javascript. Therefore, .click(); does nothing.
I haven’t test it, but maybe this will work:

eval($('.myButton').attr('href'));

Method 2

trigger(‘click’) fires jQuery’s click event listener which .NET isn’t hooked up to. You can just fire the javascript click event which will go to (or run in this case) what is in the href attribute:

 $('.myButton')[0].click();

or

 ($('.myButton').length ? $('.myButton') : $('<a/>'))[0].click();

If your not sure that the button is going to be present on the page.

Joe

Method 3

If you need the linkbutton’s OnClick server-side event to fire, you need to use __doPostback(eventTarget, eventArgument).

ex:

<asp:LinkButton ID="btnMyButton" runat="Server" OnClick="Button_Click" />

<script type="text/javascript">

function onMyClientClick(){ 
  //do some client side stuff

  //'click' the link button, form will post, Button_Click will fire on back-end
  //that's two underscores
  __doPostBack('<%=btnMyButton.UniqueID%>', ''); //the second parameter is required and superfluous, just use blank
}

</script>

Method 4

you need to assign an event handler to fire for when the click event is raised

    $(document).ready(function() {
        $('.myButton', '#form1')
            .click(function() {  
                /* 
                   Your code to run when Click event is raised.
                   In this case, something like window.location = "http://..."                      
                   This can be an anonymous or named function
                */
                return false; // This is required as you have set a PostbackUrl
                              // on the LinkButton which will post the form
                              // to the specified URL
            }); 
    });

I have tested the above with ASP.NET 3.5 and it works as expected.

There is also the OnClientClick attribute on the Linkbutton, which specifies client side script to run when the click event is raised.

Can I ask what you are trying to achieve?

Method 5

The click event handler has to actually perform an action. Try this:

$(function () {
    $('.myButton').click(function () { alert('Hello!'); });
});

Method 6

you need to give the linkButton a CssClass=”myButton” then use this in the top

$(document).ready(function() {
        $('.myButton').click(function(){
             alert("hello thar");
        });
    });

Method 7

That’s a tough one. As I understand it, you want to mimic the behavior of clicking the button in javascript code. The problem is that ASP.NET adds some fancy javascript code to the onclick handler.

When manually firing an event in jQuery, only the event code added by jQuery will be executed, not the javascript in the onclick attribute or the href attribute. So the idea is to create a new event handler that will execute the original javascript defined in attributes.

What I’m going to propose hasn’t been tested, but I’ll give it a shot:

$(document).ready(function() {

// redefine the event
$(".myButton").click(function() {
   var href = $(this).attr("href");

   if (href.substr(0,10) == "javascript:") {
      new Function(href.substr(10)).call(this);
      // this will make sure that "this" is
      // correctly set when evaluating the javascript
      // code
   } else {
      window.location = href;
   }

   return false;
});

// this will fire the click:

$(".myButton").click();

});

Method 8

Just to clarify, only FireFox suffers from this issue. See http://www.devtoolshed.com/content/fix-firefox-click-event-issue. In FireFox, anchor (a) tags have no click() function to allow JavaScript code to directly simulate click events on them. They do allow you to map the click event of the anchor tag, just not to simulate it with the click() function.

Fortunately, ASP.NET puts the JavaScript postback code into the href attribute, where you can get it and run eval on it. (Or just call window.location.href = document.GetElementById(‘LinkButton1’).href;).

Alternatively, you could just call __doPostBack(‘LinkButton1’); note that ‘LinkButton1’ should be replaced by the ClientID/UniqueID of the LinkButton to handle naming containers, e.g. UserControls, MasterPages, etc.

Jordan Rieger


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
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x