asp.net - Using Lab.js in master page to load jQuery asynchronously and then using jQuery code in child files -

i use lab.js load jquery asynchronously in asp.net master page. problem use

$( document ).ready(function() {     //something });  

and other jquery dependent code in child pages, makes script error: ($ undefined) because jquery being loaded asynchronously in master page.

how can defer parsing jquery code in child pages until asynchronous loading of jquery completed in master page?

the problem asynchronous loading of jquery master page , using jquery code in child pages. how can done?

note: don't make mistake of conflating $.ready(..) "jquery ready", many do. $.ready(..) tells when document ready (fully parsed), whereas script loading (especially dynamic kind libs labjs) entirely separate. here, you're looking "is jquery loaded/ready", should handled script loader if possible. may also need wait document ready, in case should use $.ready(..). don't substitute 1 other!

---

the simplest way (but not best) declare global variable in master page holds lab chain that's loading main jquery file, chain off in child pages. in master page:

var $jqloading = $lab.script("jquery.js"); 

and in child pages:

$jqloading.wait(function(){    // jquery code goes here }); 

---

another option rely on labjs de-duping script requests (default behavior), attempt load of jquery in each child, use same url parent did, , labjs make sure 1 copy of jquery gets loaded, chains waiting on notified once 1 load finishes. so, in child pages:

$lab.script("jquery.js").wait(function(){    // jquery code goes here }); 

this may slightly less efficient, avoids needing global variable, better design imo.

---

the sophisticated solution use promise represent loading of jquery script, , chain of promise in each child page. that's beyond we'll cover here, there's plenty out there promises if you're interested in learning them.