views:

1628

answers:

4

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?

A: 

Try to move the script block at the end of the file - below the other code but before the tag.

abjbhat
I tried that, didn't help.
kartikq
+4  A: 

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.

Doug Neiner
Doug, I had another JS file included in my page that was causing this. I need to drink more caffeine.
kartikq
A: 

I've got the same error mine occurs when i load an external file using the .load(''); then .dialog('open');
function then close it by clicking the X button top right of the dialog .. then if i go to reopen the same dialog using the same method it throws that error... my

$('#dialog').dialog({
        autoOpen: false,width: 600,height:400,buttons: {
            "Save": function() { 
                //Code Works Fine..
        }, close:function(){$(this).dialog('destroy');}
    });  

Not sure whats wrong .. i assume destroying it then forcing it to load again would solve the problem but either i'm doing it wrong or it doesnt work properly

any ideas?

Aceth
ok after playing a little more ... I've found that by changing the autoopen value to true my buttons "Save" and "Cancel" (which not shown above) works ok .. it just seems to be when the content is load.. whether its my code that breaks it im not sure ill keep at it
Aceth
+1  A: 

I had the exact same problem as the one described above (messagebox only opens once). The problem i had was that the html in the messagebox also loads jquery. Since i don't needed it i could remove it without problems. Otherwise you might have to pin down the problem a bit further.

Sander