CODEWITHSUNDEEP
javascriptjquerydialog
Vonder
Vonder

Reputation: 4059

How to add multiple buttons in Jquery UI dialog box?

I would like to have more than one button. I tried to copy code between brackets but doesnt work.Ideas?

buttons: {

"Close": function() {
 $(this).dialog("close");

}

Upvotes: 11

Views: 30955

Answers (2)

jgibbs
jgibbs

Reputation: 442

To add to this, the button array method is useful to know about as it exposes more functionality per button, such as adding icons and other per-button properties. The points to note being the added square brackets around the set of buttons turning it into an array of buttons, and the extra curly braces around each button object.

$("#mydialog").dialog({
  buttons: [{
    text: 'Confirm',
    icons: {
        primary: "ui-icon-check"
    },
    click: function() {
       //do something
       $(this).dialog('close');
    }},{
    text: 'Cancel',
    icons: {
        primary: "ui-icon-cancel"
    },
    click: function() {
       $(this).dialog('close');
    }
  }]
});

Upvotes: 5

Nick Craver
Nick Craver

Reputation: 630637

Create them using this format, 'button text': function() { } with a comma inbetween, like this:

$("#mydialog").dialog({
  buttons: {
    'Confirm': function() {
       //do something
       $(this).dialog('close');
    },
    'Cancel': function() {
       $(this).dialog('close');
    }
  }
});

Upvotes: 35

Related Questions