jQuery UI dialog - unable to remove buttons.

Question

How do I remove the buttons in a jquery dialog? Per example, I tried re-calling .dialog with the correct new options, but the dialog seems unaffected.

$('.selector').dialog('option', 'buttons', {} ); does not work, and nor does it work if actual new button strings and functions are declared.

Thoughts?

Answer 1

You need to destroy the current one first. Then you can make a new one with the new options you want.

EDIT (to response to comment): I don't know what to tell you. I did the following on my site and WFM.

$('.selector').dialog('destroy');
$('.selector').dialog({ buttons: { "Ok": function() { $(this).dialog("close"); } } });
$('.selector').dialog('open');

You need to return to pre-init state to alter the buttons, which is what destroy does. Maybe I just wasn't clear enough on the steps.

Answer 2

You are passing new buttons set in a wrong way. Options should be passed as an object.

This will work:

var options = {
    buttons: {}
};
$(selector).dialog('option', options);

No need to destroy and create new dialog.

Of course you can also replace buttons object with a new set of buttons if you wish:

var options = {
    buttons: {
        NewButton: function () {
            $(this).dialog('close');
            // add code here
        }
    }
};
$(selector).dialog('option', options);

Answer 3

The discussion here is better: http://www.nabble.com/jQuery-dialog-add-remove-button-on-the-fly-td22036498s27240.html

Add in the prescribed extensions and you can just use addbutton and removebutton (should switch to camel case naturally :)

Answer 4

Buttons cannot be added/set while the dialog is loading.