Solved

Is there a way to force next line of code to run after jquery ".load completes"

Posted on 2011-09-19
3
223 Views
Last Modified: 2012-06-27
I am using "$("divIdName").load()" function to populate a div element.  For some reason, I seem to be having a timing issue where the subsequent lines of code seem to be executed before the load completes.  Is there a way I can force the load to complete before the subsequent lines of code are executed?
0
Comment
Question by:rawcoder
3 Comments
 
LVL 82

Expert Comment

by:leakim971
ID: 36560122
use : $.ajaxSetup({"async":false});

$.ajaxSetup({"async":false});
$("divIdName").load(.............. // your current code here
$.ajaxSetup({"async":true});

Open in new window


or use the full ajax : $.ajax({ "async":false, "url":"the_url_youve_in_load", function(data) { $("divIdName").html( data ); } });
0
 
LVL 11

Accepted Solution

by:
JohnSixkiller earned 500 total points
ID: 36565217
Hi

you are using AJAX (Asynchronous Javascript and XML). So every request you make is served in background and any following code is executed immediately after the request. This approach will prevent browser to freeze if server response (for any reason) is delayed.

You have two options:

1) Make synchronous request - If you are sure that server response will not take long
use leakim9871s code or
var html = $.ajax({
  url: "your_url",
  async: false
 }).responseText;
$("divIdName").html(html);

Open in new window

See: http://api.jquery.com/jQuery.ajax/

2) Make it really asynchronous
$("divIdName").load("your_url",function(){
  // The rest of your code goes here. It will be executed AFTER request is completed
 ...
});

Open in new window

See: http://api.jquery.com/load/
0
 
LVL 6

Expert Comment

by:jjperezaguinaga
ID: 36570334
Greetings rawcoder,

The best way to solve your issue is to handle whatever's next your load with a function. JohnSixKiller second option is the way to go.

Best regards,
-JJ
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Convert .csv to tab delimited text 11 36
HTML Anchor Link Problem 3 38
javascript - insert into js doc help 2 25
Visual Studio npm 1 12
This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
I found this questions asking how to do this in many different forums, so I will describe here how to implement a solution using PHP and AJAX. The logical flow for the problem should be: Write an event handler for the first drop down box to get …
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

830 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question