Question

I’m putting together a simple web page that presents the user with a jQuery slider to select a value. The ‘stop’ event from the slider should trigger a GET request that sends the value to a bit of PHP code to handle the response. The user then gets redirected to another page:

stop: function( event, ui ) {
   var slideValue = $( "#slider" ).slider( "value" );
   $.get('submit.php', { item : slideValue });
   window.location = "thanks.html";
}

This works perfectly — but only if I use Firefox or the iPad version of Safari. Both of these generate HTTP requests that do the job.

The problem is with Mac OS Safari. slideValue is correctly set, and the redirect happens — but for some reason the GET request doesn’t do what it ought to, and the PHP code isn’t called.

Calling submit.php?item=<number> manually from Safari works.

I am new to both JavaScript and jQuery, so I’m not sure if I’m missing something obvious.

Answer 1

You should wait the answer of your get request before changing the location !

stop: function( event, ui ) {
   var slideValue = $( "#slider" ).slider( "value" );
   $.get('submit.php', { item : slideValue },function() {
     window.location = "thanks.html";
   });
}

If you use jQuery 1.5, you can use deferred object:

stop: function( event, ui ) {
   var slideValue = $( "#slider" ).slider( "value" );
   $.get('submit.php', { item : slideValue })
   .success(function() {
     window.location = "thanks.html";
   })
   .error(function() {
     alert("error");
   });
}