jquery - Make an async ajax request when clicking on a link -
i'm using php/jquery , have next scenario:
i have site (site1.php) link, points site (site2.php), added link ajax-onclick-event jquery requests site (ajaxcall.php). other site has "a lot of work" do, it's not short request.
my goal is: set request ajaxcall.php in background (asynchron) , go site2.php. (i not need reply of ajaxcall.php)
my first implementation this:
<!doctype html> <html> <head> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $("#link").on("click",function(){ $.get('./ajaxcall.php'); </script> </head> <body> <a href="./file2.php" id="link">link</a> </body> </html> obviously won't work. because ajax-request (which async), aborted page changed.
so far can see have 2 possiblities here:
make request synchron & show loading indicator ($.ajax({url: './ajaxcall.php',async:false});) --> disadvantage: file2.php not open before ajaxcall.php done.
open popup (window.open('ajaxcall.php')) , create synchron-ajax-request / or similar there , auto-close after --> advantage: file2.php should open --> (big)disadvantage: popup
??? improve way ???
i hope understood i'm trying accomplish , can help me :)
try code...
$(document).ready(function() { $("#link").on("click",function(e){ e.preventdefault(); var href = this.href; $.get('./ajaxcall.php', function() { window.location.href = href; }); }); }); it stops execution of link (with e.preventdefault()), gets target url , redirects page location when request complete.
jquery ajax asynchronous
No comments:
Post a Comment