Aggiungi classe ai pulsanti di dialogo jquery

Question

Desidero aggiungere la classe css sui pulsanti di una finestra di dialogo jquery.

Ecco il mio codice:

$(document).ready(function(){ 
     $('#messageBox p').html('bla bla bla. Ok?'); 
     $('#messageBox').dialog({ 
     modal : true, 
     buttons: { 
      'Yes': function() { 
      doSomething(); 
      $(this).dialog('close'); 
      }, 
      'No': function() { 
      doAnotherThing(); 
      $(this).dialog('close'); 
      } 
     } 
     }); 
    }); 

Per esempio, vorrei aggiungere classe ".red" sul mio pulsante 'Sì'.

Come posso farlo?

Grazie!

Answer 1

buttons: [ 
      { 
       text: "Submit", 
       "class": 'submit_class_name', 
       click: function() {      
        $(this).dialog("close"); 
       } 
      }, 
      { 
       text: "Cancel", 
       click: function() { 
        $(this).dialog("close"); 
       } 
      } 
      ] 

Answer 2

Hai provato la funzione addClass?

Answer 3

.addClass funzionano  

Answer 4

C'è una dialogClass un'opzione della funzione finestra è possibile utilizzare per specificare una classe CSS per la finestra stessa. Puoi dargli un nome di classe univoco e usare questo nome di classe per ottenere un riferimento a qualsiasi elemento figlio della finestra di dialogo. Quindi, utilizzare i selettori per ottenere un riferimento ai pulsanti secondari per posizione o per il testo che contiene (probabilmente più efficiente per utilizzare il primo).

Answer 5

ho la soluzione, grazie a Rich:

$(document).ready(function(){ 
     $('#messageBox p').html('bla bla bla. Ok?'); 
     $('#messageBox').dialog({ 
     modal : true, 
     dialogClass: 'dialogButtons', 
     buttons: { 
      'Yes': function() { 
       doSomething(); 
       $(this).dialog('close'); 
      }, 
      'No': function() { 
       doAnotherThing(); 
       $(this).dialog('close'); 
      } 
     } 
     }); 
    }); 
$("div.dialogButtons div button:nth-child(1)").addClass("oneCssClass"); 
$("div.dialogButtons div button:nth-child(2)").addClass("anotherCssClass"); 

risolto!

Answer 6

Aveva lo stesso problema. Molto simile alla soluzione di nico ma aggiungere lo stile alla funzione aperta sul dialogo:

open: function() { 
       // add style to buttons (can't seem to do this via the button definition without breaking IE) 
       $(".someDialog .ui-dialog-buttonset button:first").not(".buttonPrimary").addClass("buttonPrimary"); 
       $(".someDialog .ui-dialog-buttonset button:last").not(".buttonSecondary").addClass("buttonSecondary"); 
       $("#someDialog").focus(); 
      }