jQueryUI Dialog - style not generated for buttons
I use the the following code to show a dialog with jQuery UI:
var $dialog = $('<div></div>')
.text(msg)
.dialog({
autoOpen: false,
height: 140,
modal: true,
title: "Confirm",
buttons: {
"Yes": function() {
$(this).dialog('close');
},
"Cancel": function() {
$(this).dialog('close');
}
}
});
$dialog.dialog('open');
However, the buttons have no styles. I notice that the HTML generated for the buttons are:
<div class="ui-dialog-buttonset">
<button>Yes</button>
<button>Cancel</button>
</div>
From the jQuery UI demos it is:
<div class="ui-dialog-buttonset">
<button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false"><span class="ui-button-text">Ok</span></button>
<button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false"><span 开发者_JAVA技巧class="ui-button-text">Cancel</span></button>
</div>
I.e. the CSS styles are missing. Do you know why?
If you use Bootstrap and JQueryUI, jquery-ui.js must be included AFTER bootstrap.js.
Perhaps because the CSS files are missing? Do you actually include them? Then use firebug or httpfox to see if there's a 404 somewhere...
Edit: I include a jQuery-ui css like this: <link type="text/css" href="blah/css/smoothness/jquery-ui-1.8.custom.css" rel="stylesheet" />
精彩评论