Home/ Questions/Q 6580145
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-25T15:59:22+00:00

I am having a problem where the page is loading so fast, that jquery

  • 0

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:

  1. Master page header.
  2. Child page content block 1 (located inside the
    head of the masterpage, but after the masterpage scripts are
    called).
  3. 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();
    });

});
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    edit

    Could you try the correct type for your script tags?
    I see you use text/Scripts, which is not the right mimetype for javascript.

    Use this:

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> 
<script type="text/javascript" src="../Scripts/jquery.dropdownPlain.js"></script>
<script type="text/javascript" src="../Scripts/facebox.js"></script>

    end edit

    or you could take a look at require.js which is a loader for your javascript code.

    depending on your project, this could however be a bit overkill

    • 0