JQuery UI dialog - *Dialog not a function* error

Viewed 59524

I am developing a site using pinax. In one of my templates I am trying to open a simple jquery dialog box. However I keep getting the "Dialog not a function" javascript error. I am using jquery 1.2.6 and jquery-ui 1.6. My javascript and HTML are as follows:

<html>
<head>
<link type="text/css" href="/site_media/smoothness/ui.all.css" rel="stylesheet" />
<script src="/site_media/jquery.js" type="text/javascript"></script>
<script src="/site_media/ui/ui.core.js" type="text/javascript"></script>
<script src="/site_media/ui/ui.draggable.js" type="text/javascript"></script>
<script src="/site_media/ui/ui.resizeable.js" type="text/javascript"></script>
<script src="/site_media/ui/ui.dialog.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
                    $('#dialogbox').dialog();
            });
 </script>
 </head>
 <body>
   <div id="dialogbox" title="dialog title">
     <p>Test dialog</p>
   </div>
 </body>
 </html>

Can someone please explain why this is happening?

8 Answers

I tried to duplicate your error both by using the public google versions and by downloading the legacy (1.6) version from the jQuery UI site and manually including the files. Neither caused a problem (http://jsbin.com/uloqi to see it working).

So, that means one of the following might solve your problem:

  1. Use a tool like Firebug for Firefox to verify each JS file is being included.
  2. Make sure there is no other JS on the page that could cause an error.
  3. Verify you have the correct versions of the files downloaded.

I don't know what else to tell you since the code you pasted, when paired with the right files, works perfectly.

I had the same problem. Mine was self inflicted from a jQuery UI update from 1.11.4 to 1.12.1. I installed the upgrade using NuGet and NuGet removed the old 1.11.4 reference from my project but never added the new project reference.

Running locally the application worked great, but when deploying it the new 1.12.1 file never made it with the publish. I hope this helps someone else.

Another situation that can cause this issue is nested layouts that ultimately inhibit the rendering of jqueryUI scripts. I encountered this situation and worked backwards through the view folder and worked backward through the layouts to discover the "prevailing" layout did not have jqueryUI, just jquery, even though jqueryUI was specified in the "topmost" layout in the hierarchy. When I explicitly added it to the specifically named layout file, the problem was resolved - although I suspect the real issue involves digging through the layouts and understanding why sections were duplicated.

Related