JScript runtime error: '$' is undefined

javascript jquery asp.net-mvc-4 runtime-error undefined

16,484

jquery isn't present.

Look at this line: <script type="text/javascript" src="~/Scripts/jquery.qtip-1.0.0-rc3.min.js"> </script>

Check that you have that Scripts/jquery.qtip-1.0.0-rc3.min.js on the server

It is also NOT usual to refer to your home directory there - where you have the "~". If your script is in a Scripts directory then you just use Scripts/jquery.qtip-1.0.0-rc3.min.js because with a web server, everything is within it's root (top level) directory.

Also is this file the main jquery library? It's not clear to me whether this is just your script code and if so you'll need to include the main js library with something like:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

btw, aim to use lowercase for directory names - scripts not Scripts as it will make your life easier in the long run. I would also recommend script not scripts as many directories have multiple files (their purpose after all) so most folks use singular directory. This is closer to a preference though than the ~ issue.

Also, while debugging and playing around, remember that you can actually have the script in the same file, within <script> tags, not in a separate file. Not recommended long-term as a good practice but useful for seeing where the issue is.

16,484

Author by

Danielle

Updated on June 14, 2022

Comments

Danielle almost 2 years

My project is in MVC 4. My scripts are in _Layout.cshtml when reload the page the following error: JScript runtime error: '$' is undefined

_Layout.cshtml:

 <head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title</title>
    <link href="~/Images/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />
    @Styles.Render("~/Content/css")
    @Scripts.Render("~/bundles/modernizr")
    @Scripts.Render("~/bundles/jquery") 
    @Scripts.Render("~/bundles/jqueryui")
    <script type="text/javascript" src="~/Scripts/jquery.qtip-1.0.0-rc3.min.js"> </script>
 </head>

My Partial View:

   <script type="text/javascript">

       $('#lnkOrganizar').click(function () {
       if (($('.frozenTopC').css('display') != 'none') &&      ($('.frozenTopConteudo').css('display') != 'none')) {
           $('.frozenTopC').css('display', 'none');
           $('.frozenTopConteudo').css('display', 'none');
        }
        else {
         $('.frozenTopC').css('display', 'table-cell');
         $('.frozenTopConteudo').css('display', 'table-cell')
        }
     });

  </script>