Error TypeError dialog is not a function

Question

I am having an issue getting a dialog to work as basic functionality  Here is my jQuery source imports    lt script type  text javascript  src  scripts jquery-1 9 1 js  gt  lt  script gt   lt script type  text javascript  src  scripts jquery-ui-1 11 1 js  gt  lt  script gt   lt script type  text javascript  src  scripts json debug js  gt  lt  script gt    Html    lt button id  opener  gt open the dialog lt  button gt   lt div id  dialog1  title  Dialog Title  hidden  hidden  gt I m a dialog lt  div gt    lt script type  text javascript  gt          opener   click function                     dialog1   dialog  open             lt  script gt    From the posts around seems like as a library import issue  I downloaded the JQuery UI Core  Widget  Mouse and Position dependencies   Any Ideas

User · Answer

If you comment out the following code from the  Layout cshtml page  the modal popup will start working        lt  footer gt          Scripts Render    bundles jquery          RenderSection  scripts   required  false       lt  body gt   lt  html gt

User · Answer

I had a similar problem and in my case  the issue was different  I am using Django templates     The order of JS was incorrect  I know that s the first thing you check but I was almost sure that that was not the case  but it was   The js calling the dialog was called before jqueryUI library was called   I am using Django  so was inheriting a template and using   super block   to inherit code from the block as well to the template  I had to move   super block   at the end of the block which solved the issue  The js calling the dialog was declared in the Media class in Django s admin py  I spent more than an hour to figure it out  Hope this helps someone

User · Answer

Here are the complete list of scripts required to get rid of this problem   Make sure the file exists at the given file path        lt script src   Url Content    Scripts jquery-1 8 2 js    type  text javascript  gt       lt  script gt       lt script src   Url Content    Scripts jquery-ui-1 8 24 js    type  text javascript  gt       lt  script gt       lt script src   Url Content    Scripts jquery validate js    type  text javascript  gt       lt  script gt       lt script src   Url Content    Scripts jquery validate unobtrusive js    type  text javascript  gt       lt  script gt       lt script src   Url Content    Scripts jquery unobtrusive-ajax js    type  text javascript  gt       lt  script gt    and also include the below css link in  Layout cshtml for a stylish popup    lt link rel  stylesheet  type  text css  href        Content themes base jquery-ui css    gt

User · Answer

Be sure to insert full version of jQuery UI  Also you should init the dialog first    x000D   x000D    function      x000D         dialog1    dialog   x000D      autoOpen  false x000D        x000D     x000D        opener   click function     x000D          dialog1   dialog  open    x000D        x000D      x000D   lt script src  https   code jquery com jquery-1 11 1 min js  gt  lt  script gt  x000D    x000D   lt script src  https   code jquery com ui 1 11 1 jquery-ui min js  gt  lt  script gt  x000D   x000D   lt link rel  stylesheet  href  https   code jquery com ui 1 11 1 themes smoothness jquery-ui css    gt  x000D   x000D   lt button id  opener  gt open the dialog lt  button gt  x000D   lt div id  dialog1  title  Dialog Title  hidden  hidden  gt I m a dialog lt  div gt  x000D   x000D   x000D

User · Answer

Change jQueryUI to version 1 11 4 and make sure jQuery is not added twice

User · Answer

if some reason two versions of jQuery are loaded  which is not recommended   calling   noConflict true  from the second version will return the globally scoped jQuery variables to those of the first version   Some times it could be issue with older version  or not stable version  of JQuery files   Solution use   noConflict      lt script src  other lib js  gt  lt  script gt   lt script src  jquery js  gt  lt  script gt   lt script gt    noConflict    jQuery  document   ready function               opener   click function                     dialog1   dialog  open                   Code that uses other library s   can follow here   lt  script gt

User · Answer

I just experienced this with the line       lt div id  editor    gt    dialogelfinder     I got the error  dialogelfinder is not a function  because another component was inserting a call to load an older version of JQuery  1 7 2  after the newer version was loaded   As soon as I commented out the second load  the error went away

[javascript] Error: TypeError: $(...).dialog is not a function

Examples related to javascript

Examples related to jquery

Examples related to jquery-ui-dialog