1

I know a lot of people have had this issue, and I've seen that for these guys its reference duplication. But for me I cannot see anywhere anything that has been duplicated.

Here is my code:

HTML

<title>The HUB</title> <link rel="stylesheet" href="/css/styles.css" type="text/css" /> 
<link rel="stylesheet" href="/css/jquery.ui.all.css"> 
</head> 
<body> 
<script type="text/javascript" src="/js/jquery-1.6.2.min.js"></script> 
<script type="text/javascript" src="/js/hub.js?n=1"></script> 
<script type="text/javascript" src="/js/testSignal.js"></script>  
<script type="text/javascript" src="/js/ui/jquery.ui.core.js"></script> 
<script type="text/javascript" src="/js/ui/jquery.ui.widget.js"></script>  
<script type="text/javascript" src="/js/ui/jquery.ui.mouse.js"></script>  
<script type="text/javascript" src="/js/ui/jquery.ui.draggable.js"></script> 
<div id="wrapper"> ....  <div id="dialog"><p>Some Text</p></div></div>

jQuery

$(document).ready(function(){
    $("#dialog").dialog({ autoOpen: false });
    $("#testSignalBtn").click(function(){
        $("#dialog").dialog("open");
        return false;
    });
});

Ive tried reordering all of the javscript files, enabling some and not others etc, and it doesn't seem to work. The file hub.js?n=1 does use jQuery and has no problems. - It's not a file I wrote, I've take over this from someone else. And I have tried disabling that file, but I still get the same problem.

Here is what other people have said on the same thing: Uncaught TypeError: Object [object Object] has no method 'dialog' and here too: jQuery Uncaught TypeError: Object[object Object] has no method slider

Community
  • 1
  • 1
Johnny
  • 117
  • 1
  • 2
  • 8
  • 1
    Sorry if this sounds silly, but did you also include `jquery.ui.dialog.js`? – pimvdb Aug 17 '12 at 15:25
  • No you're not silly, i've just downloaded that file and it seems to have sorted it. I initially assumed that the dialog was included in the widget file, and didn't occur to me that it wouldn't be. The original developer of this site has caused me so many problems, when trying to add new features etc. Thanks pimvdb :) – Johnny Aug 17 '12 at 15:33
  • I feel like an idiot now asking this question... – Johnny Aug 17 '12 at 15:44
  • No you're not, perhaps you just looked at it for too long :) – pimvdb Aug 17 '12 at 15:47
  • Thanks, I definitely looked at it too long, and couldn't see the obvious. – Johnny Aug 21 '12 at 08:12
  • Use `jQuery.noConflict();` before the start of your jQuery function to avoid conflicts with multiple (different) versions of jQuery files. – Faizan Jan 06 '13 at 09:51

3 Answers3

7

dialog, like draggable, is a widget. You'd have to include it if you want to use it:

<script type="text/javascript" src="/js/ui/jquery.ui.dialog.js"></script>
pimvdb
  • 151,816
  • 78
  • 307
  • 352
6

Instead of having all of those separate files, just include the entire jQuery UI CDN link:

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.22/jquery-ui.min.js"></script>

Just tried it in a fiddle and everything you have works fine, it must be a missing .js file.

http://jsfiddle.net/nU5TF/

Steven Magana-Zook
  • 2,751
  • 27
  • 41
Mark Pieszak - Trilon.io
  • 61,391
  • 14
  • 82
  • 96
0

As pimvdb stated above, dialog is a widget. However, many projects do not use the separate widget include files but one customizable compiled and minified version. To make sure that the dialog widget was included in your build, open the jquery-ui.js file in a text editor: the header tells you which components are included, like so:

/*! jQuery UI - v1.10.0 - 2013-02-14
* http://jqueryui.com
* Includes: jquery.ui.core.js, jquery.ui.widget.js, jquery.ui.mouse.js, jquery.ui.position.js, jquery.ui.draggable.js, jquery.ui.droppable.js, jquery.ui.resizable.js, jquery.ui.selectable.js, jquery.ui.sortable.js
* Copyright (c) 2013 jQuery Foundation and other contributors Licensed MIT */

In my case almost everything except the dialog widget was included.

AeonOfTime
  • 956
  • 7
  • 10