I am having a problem where the page is loading so fast, that jquery hasn't finished loading before it is being called by a subsequent script. Is there a way to check for the existence of jquery and if it doesn't exist, wait for a moment and then try again?
In response to the answers/comments below, I am posting some of the markup.
The situation... asp.net masterpage and childpage.
In the masterpage, I have a reference to jquery.
Then in the content page, I have a reference to the page-specific script.
When the page specific script is being loaded, it complains that $ is undefined.
I put alerts at several points in the markup to see the order in which things were firing, and confirmed that it fires in this order:
- Master page header.
- Child page content block 1 (located inside the
head of the masterpage, but after the masterpage scripts are
called). - Child page content block 2.
Here is the markup at the top of the masterpage:
<%@ Master Language=C# AutoEventWireup=true CodeBehind=Site.master.cs Inherits=SiteMaster %>
<!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>
<html xmlns=http://www.w3.org/1999/xhtml>
<head id=Head1 runat=server>
<title>Reporting Portal</title>
<link href=~/Styles/site.css rel=stylesheet type=text/css />
<link href=~/Styles/red/red.css rel=stylesheet type=text/css />
<script type=text/Scripts src=http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js></script>
<script type=text/Scripts language=javascript src=../Scripts/jquery.dropdownPlain.js></script>
<script type=text/Scripts language=javascript src=../Scripts/facebox.js></script>
<meta http-equiv=X-UA-Compatible content=IE=EmulateIE7 />
<asp:ContentPlaceHolder ID=head runat=server>
</asp:ContentPlaceHolder>
</head>
Then in the body of the masterpage, there is an additional ContentPlaceHolder:
<asp:ContentPlaceHolder ID=ContentPlaceHolder1 runat=server>
</asp:ContentPlaceHolder>
In the child page, it looks like so:
<%@ Page Title= Language=C# MasterPageFile=~/Site.Master AutoEventWireup=true CodeBehind=Dashboard.aspx.cs Inherits=Data.Dashboard %>
<%@ Register src=../userControls/ucDropdownMenu.ascx tagname=ucDropdownMenu tagprefix=uc1 %>
<asp:Content ID=Content1 ContentPlaceHolderID=head runat=server>
<link rel=stylesheet type=text/css href=../Styles/paserMap.css />
</asp:Content>
<asp:Content ID=Content2 ContentPlaceHolderID=ContentPlaceHolder1 runat=server>
***CONTENT HERE***
<script src=../Scripts/Dashboard.js type=text/javascript></script>
</asp:Content>
Here is the content of the ../Script/Dashboard.js file:
$(document).ready(function () {
$('.tgl:first').show(); // Show the first div
//Description: East panel parent tab navigation
$('.tabNav label').click(function () {
$('.tabNav li').removeClass('active')
$(this).parent().addClass('active');
var index = $(this).parent('li').index();
var divToggle = $('.ui-layout-content').children('div.tgl');
//hide all subToggle divs
divToggle.hide();
divToggle.eq(index).show();
});
});