Button click event not firing from javascript

Question

I need to do a postback and save the data in the screen to session when the screen is closed, for this i am using the onBeforeUnload event, and placed a hidden button in the screen. In the on before unload event I am calling the click event to call the button server event. But the event is not firing. Is anything I am missing here.

<asp:Button Style="display: none" runat="server" ID="btnHidUpdate" OnClick="btnHidUpdate_Click" />
<script type="text/javascript">
  $(document).ready(function () {
    window.onbeforeunload = updateSessionBeforeUnload; 
  });
</script>

In .js file:

function updateSessionBeforeUnload() {
  var hidUpdate = $('[id$="btnHidUpdate"]')[0];
  hidUpdate.click();
}

In .cs code behind:

protected void btnHidUpdate_Click(object sender, EventArgs e)
{
  UpdateSession();
}

Stupid question, but have you included the .js file in your inline code, which contains the updateSessionBeforeUnload function? <script language="javascript" src="file.js" type="text/javascript"> </script> — tranceporter
– tranceporter, Commented Sep 13, 2012 at 10:19
Please take a look at the html source in the browser. Is the id of the button "btnHidUpdate"? IIRC, asp.net changes the ID. Also, I don't think this is how you can call the method on the server from the client. — shahkalpesh
– shahkalpesh, Commented Sep 13, 2012 at 10:21
I have included the .js file also jqueary, other thing that i just found, when i add a new code like say calling a var hid = $('[id$="hid"]')[0]; after the click call the event starts firing, but this does not work from a client machine. — ARV
– ARV, Commented Sep 13, 2012 at 10:34
Unfortunately the click event is created as an async call meaning that it will call click and then leave the page. probably before it has chance to execute the click handler. — Mark Broadhurst
– Mark Broadhurst, Commented Sep 13, 2012 at 10:37

Mark Broadhurst · Accepted Answer · 2012-09-13 12:58:23Z

1

The problem is that the page loads the next page before it can execute the button click.

Use the Jquery Unload event e.g.

$(function(){
    $(window).unload(function(){
       // put synchronous code here to persist what you need.
    });
});

You can use an Ajax event like Yuriy says however you must set async to false like this:

      $.ajax({
           type: "POST",
           url: "Url/To/Persistance",
           dataType: "json",
           data : { "data" : "to be persisted"},
           async: false
      });

EDIT I would avoid the click event all together and do something like this:

$(function(){
    $(window).unload(function(event){
       var hidUpdate = $('[id$="btnHidUpdate"]')[0];
       __doPostBack(hidUpdate.attr('id'),'');
    });
});

However if you must click the button try this

$(function(){
    $(window).unload(function(event){
       var hidUpdate = $('[id$="btnHidUpdate"]')[0];
       hidUpdate.click()
       alert(
         "Default: " + event.isDefaultPrevented() + "\n" + 
         "ImedPropStopped: " + event.isImmediatePropagationStopped() + "\n" + 
         "PropStopped: " + event.isPropagationStopped()
       );
    });
});

And tell us what the alert says ?

edited Sep 13, 2012 at 12:58

answered Sep 13, 2012 at 11:17

Mark Broadhurst

2,69523 silver badges47 bronze badges

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

7 Comments

ARV Over a year ago

Using, the unload, does fire the click event, but page navigation does not occur, any idea why this would be a problem, if i remove the click call navigation works fine.

Mark Broadhurst Over a year ago

I haven't tried calling the click on the unload, I would have thought that you would have the same result (async clicking the button). I've updated my answer with an alternate way of doing and and if not a debug to tell us what is stopping it.

Mark Broadhurst Over a year ago

Additional info here on __doPostBack evagoras.com/2011/02/10/how-postback-works-in-asp-net

ARV Over a year ago

The event.isDefaultPrevented() function and other function is not available in event, also the _doPostBack does not do the navigation.

Mark Broadhurst Over a year ago

let us continue this discussion in chat

|

Ben · Accepted Answer · 2012-09-14 21:33:17Z

1

I think the other suggestions here should work fine. I have another suggestion which you can try, and is to use GetPostBackEventReference. You can see details about it here: http://msdn.microsoft.com/en-us/library/aa720417(v=vs.71).aspx

answered Sep 14, 2012 at 21:33

Ben

4233 silver badges8 bronze badges

Comments

mohanrajt · Accepted Answer · 2012-09-13 10:32:31Z

0

You can use jquery trigger("click") function which will call the click event on the button.

answered Sep 13, 2012 at 10:32

mohanrajt

1522 bronze badges

Comments

IUnknown · Accepted Answer · 2012-09-13 10:58:30Z

0

In my opinion the problem is that onbeforeunload event handler intended to ask user for confirmation when he want to leave a page. And since updateSessionBeforeUnload method doesn't returns any question string, unloading process continues immediately after this method leaves.

If you can make UpdateSession method static you can call it asynchronously with async jQuery.ajax method call:

<script type="text/javascript">
     window.onbeforeunload = foobar;

     function foobar() {
          $.ajax({
               type: "POST",
               url: "WebForm2.aspx/UpdateSession",
               contentType: "application/json; charset=utf-8",
               dataType: "json",
               async: true
          });
     }
</script>

[WebMethod]
public static void UpdateSession()
{
}

answered Sep 13, 2012 at 10:58

IUnknown

22.5k4 gold badges41 silver badges71 bronze badges

3 Comments

ARV Over a year ago

I cannot make the method static as in the metod i am updating the session from taking the data from the control, which are not accessible in a static method.

IUnknown Over a year ago

What type of control? Can you get value of this control on client?

ARV Over a year ago

The page has many control and unsercontrols data from which I have to save in session, getting all the values in client would be difficult

Collectives™ on Stack Overflow

Button click event not firing from javascript

4 Answers 4

7 Comments

Comments

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

7 Comments

Comments

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related