jQuery UI Dialog Button Icons
- by Cory Grimster
Is it possible to add icons to the buttons on a jQuery UI Dialog? I've tried doing it this way:
$("#DeleteDialog").dialog({
resizable: false,
height:150,
modal: true,
buttons: {
'Delete': function() {
/* Do stuff */
$(this).dialog('close');
},
Cancel: function() {
$(this).dialog('close');
}
},
open: function() {
$('.ui-dialog-buttonpane').find('button:contains("Cancel")').addClass('ui-icon-cancel');
$('.ui-dialog-buttonpane').find('button:contains("Delete")').addClass('ui-icon-trash');
}
});
The selectors in the open function seem to be working fine. If I add the following to "open":
$('.ui-dialog-buttonpane').find('button:contains("Delete")').css('color', 'red');
then I do get a Delete button with red text. That's not bad, but I'd really like that little trash can sprite on the Delete button as well.