jQuery-ui dialog - hide buttons using jquery

Question

How do I remove/hide the \"Ok\" button dynamically using jquery?

$(\'#dialog-save\').dialog({
            autoOpen: false,
            modal: false,
                


        

Answer 1

Juste like this won't show the button :

$('#dialog-save').dialog({
        autoOpen: false,
        modal: false,
        draggable: true,
        width: 275,
        height: 175
        }
    });

And if you want to remove them after you have shown the dialog Maybe something like this;

How can I disable a button in a jQuery dialog from a function?

Answer 2

Try this fiddle

$(function(){
    $('#dialog-save').dialog({
            autoOpen: false,
            modal: true,
            draggable: true,
            width: 275,
            height: 175,
            buttons: {
                "Ok": function () {
                    $(this).dialog("close");
                }
            }
    });
    $('#dialog-save').dialog('open');
    $('.change').click(function(){
        $('#dialog-save').dialog("option",{buttons:{}});
        $('#dialog-save').dialog('open');
    });
});​

Answer 3

You can set the buttons option in the same way you are setting the title:

saveDialog.dialog("option", "buttons", {});

Pass in an empty object literal to remove all the buttons. That should be fine, since you appear to only have the one button. If you were to have others, just specify the ones you want to keep when you call the option method.

Answer 4

One commonly overlooked feature of the UI dialog is that you can set various other properties of the buttons, including 'class' and 'id'. These can be very useful if you need to manipulate the buttons after instantiation.

For example...

$('#dialog-save').dialog({
        autoOpen: false,
        modal: false,
        draggable: true,
        width: 275,
        height: 175,
        {
            id: 'okBtn',
            text: "Ok",
            click: function () {
                $(this).dialog("close");
            }
        }]
    });

// And then at some other point in the code...
$('#okBtn').remove();