CODEWITHSUNDEEP
javascriptjquerydialog
Or Weinberger
Or Weinberger

Reputation: 7472

jQuery simple dialog not working

I'm trying to figure out why my jQuery dialog is not working properly on this page:

http://bit.ly/nOKwYz

This is the code snippet:

<script type="text/javascript">
    jQuery(document).ready(function() {
        jQuery("#dialog22").dialog();
    });
</script>

and I also have:

<div id="dialog22">test</div>

For some reason it does not load the dialog, any ideas?

Upvotes: 0

Views: 631

Answers (3)

Mike Thomsen
Mike Thomsen

Reputation: 37506

It's gotta be the library order. See this fiddle. Your sample works just fine if you have the library order right:

http://jsfiddle.net/mikethomsen/a25gw/

The way it works is you need to load jQuery.js, jQuery UI's JS and then the jQuery UI CSS, then throw in your custom code.

Edit

I replaced my fiddle's libraries with your sample and Firefox says jQuery('#dialog').dialog is not a function. That means you are missing the dialog code from the build of jQuery UI you made. You need to go back to the jQuery UI site and build a new distribution of jQuery UI that includes the other pieces you need.

Upvotes: 1

David
David

Reputation: 218837

Where do you load jQuery (and jQuery UI) on that page? You need to reference those libraries in the page (specifically before any code that uses them). Unless I'm just not seeing the reference, you do have quite a few script tags in the header.

You don't have to host a copy, though. You can reference a CDN link.

Upvotes: 0

Nicola Peluchetti
Nicola Peluchetti

Reputation: 76880

To show the dialogo you should first hide it i think:

<div id="dialog22" style="display:none;">test</div>

and then show it with a button for example

EDIT - look at the fiddle here : http://jsfiddle.net/LCPJe/

Upvotes: 0

Related Questions