Stefan Kendall
Stefan Kendall

Reputation: 67832

jQuery UI dialog - unable to remove buttons

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?

Upvotes: 7

Views: 10709

Answers (6)

rapi
rapi

Reputation: 141

FWIW,

$(".dialog").dialog("option", "buttons", null);

Upvotes: 4

BasTaller
BasTaller

Reputation: 810

Anotherm, maybe the simplest, and very flexible way to do this is via CSS. (what if you'll eventually need them in the future...).

Looks like:

.ui-dialog-titlebar-close{display:none}

If you like to do it only for some dialogs, you may add dialogClass: option while initializing the dialog, and your css will look like (e.g. you've added myDialogClass as dialogClass, so the whole dialog container will be accessible via this class:

.myDialog  .ui-dialog-titlebar-close{display:none}

Good luck in customizing!

Upvotes: 0

Stefan Kendall
Stefan Kendall

Reputation: 67832

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

Upvotes: 2

Peter
Peter

Reputation:

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 :)

Upvotes: 0

RaYell
RaYell

Reputation: 70414

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);

Upvotes: 13

geowa4
geowa4

Reputation: 41823

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.

Upvotes: 0

Related Questions