CODEWITHSUNDEEP
jqueryjquery-ui
jimmy
jimmy

Reputation: 15

JQuery UI not working

I have been trying to use JQuery UI but cant seem to get any of the methods working. I have been trying to show a dialog but havent been able to do it. Jquery is workking.

I have used Firebug and i get no errors when loading the jqueryUi, Jquery files just 304 not modified status.

I dont know if im doing something stupid or i havent setup the JQuery UI right

Any help is appreciated

Heres the code that im using

<html>
<head>
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.18.custom.css" 
  rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.18.custom.min.js"></script>    
<script type="text/javascript">
if (jQuery.ui) {
alert("Success");
}
$("#dlg_hello").dialog();

</script>
</head>
<body>
<div id="dlg_hello">Hello World!</div>
</body>
</html>

Upvotes: 0

Views: 12471

Answers (4)

Lix
Lix

Reputation: 48006

You should use a function that jQuery provides to know when the framework has been loaded successfully and is ready to use -

<script type="text/javascript">
  $(function(){
    //  now we know that jQuery has been loaded and is ready.
  });
</script>

Upvotes: 0

themarcuz
themarcuz

Reputation: 2583

Try to bind your code to the document ready event, this way

$(function (){
    if (jQuery.ui) {
       alert("Success");
    }
    $("#dlg_hello").dialog();
});

Upvotes: 1

Jay Blanchard
Jay Blanchard

Reputation: 34426

Place your dialog in a document ready wrapper

$(document).ready(function() {
    // your code here
});

Upvotes: 1

tedski
tedski

Reputation: 2311

You have to capture the page load event to instantiate a jQuery UI object.

try this:

$(document).ready(function(){
    $("#dlg_hello").dialog();
});

​

Upvotes: 3

Related Questions