jQuery UI Dialog: $(".modal").dialog is not a function?

On my page, I am loading some HTML (via AJAX)开发者_StackOverflow中文版 into a div. The new HTML contains my $('.modal') jQuery UI Dialog. Once the HTML is loaded, FireBug gives me an error message for each modal in my HTML saying:

$(".modal").dialog is not a function
    height: 'auto'

The weird thing is that it's working. When I click the element that triggers the modal to appear, it appears! What should I do to prevent these messages from showing?

put this in your document

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

Make sure you load jquery before jquery-ui in your application.

You probably have to call $(".modal").dialog after the ajax has finished loading

hmm

var dialog = $(".modal").dialog({ autoOpen: false });


$("#click").click( function(e) {
   e.preventDefault();
   dialog.dialog("open");
});

this one works for me fine !