Solución:
Puede agregar clase a los botones en el cuadro de diálogo …
$('#mydialog').dialog({
buttons:{
"send":{
text:'Send',
'class':'save'
},
"cancel":{
text:'Cancel',
'class':'cancel'
}
});
Creo que esto funcionará para ti. y puedes encontrar más respuestas aquí.
No parece que haya una excelente manera de hacer esto a través de la API, sin embargo, puede agregar las clases en un controlador de eventos para create:
$("#dialog").dialog({
buttons: {
'Confirm': function() {
//do something
$(this).dialog('close');
},
'Cancel': function() {
$(this).dialog('close');
}
},
create:function () {
$(this).closest(".ui-dialog")
.find(".ui-button:first") // the first button
.addClass("custom");
}
});
Si quisiera el segundo botón, podría usar:
$(this).closest(".ui-dialog").find(".ui-button").eq(1).addClass("custom") // The second button
La clave es la $(this).closest(".ui-dialog").find(".ui-button"), que seleccionará los botones en su diálogo. Después de eso, puede aplicar cualquier selector que desee (incluido :contains(...) que puede resultar útil si desea seleccionar un botón en función de su texto en lugar de su orden).
Aquí hay un ejemplo: http://jsfiddle.net/jjdtG/
También tenga en cuenta que el selector de CSS para los estilos que desea aplicar tiene que ser más específico que los selectores integrados de jQueryUI para que se aplique el estilo.
¡Espero que te ayude!
$("#mydialog").dialog({
buttons: {
'Confirm': function() {
//do something
$(this).dialog('close');
},
"Cancel": {
click: function () {
$(this).dialog("close");
},
text: 'Cancel',
class: 'custom-class'
}
}
});