如何在对话框加载时隐藏jQuery对话框按钮？

Question

Can someone please help me with hiding/disabling a button on jQuery dialog box?

Scenario: On button click I am opening a dialog box with 'Add' and 'Update' button. Inside the dialog I have 2 text box containing date and message.Both will populate data if data already present in database else they will be blank allowing user to add data.

Now, If text box has pre-populated data(message exist in db) I have to hide Add button as user can only update the message.I tried few tricks which I got from stackoverflow but none of them is working as I am opening dialog box on button click so I guess I am creating button dynamically and I cannot hide them on fly.

I also tried giving an id to dialog button and hiding/disabling it using below code: $('#id').hide(); $('#id').attr('disabled','disabled');

I looked into the below fiddle which is exactly what I want but If I adopt this then I have to make a lot of code change. So, was wondering if anyone can provide me an easy solution.

[http://jsfiddle.net/kkh2a/1/]

Thanks in advance.

    $('#dialog-form').dialog({width:350,height:300,
    resizable:false,
    modal:true,
    closeOnEscape: true,
    draggable:false,
    show:{effect:"fade"},
    buttons:{
        Add:{
            text:'Add',
            id:'AddMsg',
            click:function(){

        }},
        Update:function(){
            },
        Cancel:function(){
            $(this).dialog("close");
        }
    }});

Answer 1

Try this:

$('#dialog-form').dialog({
    ...
    buttons : {...},
    open : function() {
        $('#dialog-form')
            .dialog('widget')
            .find('div.ui-dialog-buttonpane div.ui-dialog-buttonset button')
                .eq(0)
                .button('disable');
    }
});

Answer 2

Hy all, I use this way:

$("#myDivForLoadingDialog").dialog({
    modal: true,
    resizable: false,
    height: "auto",
    draggable: false,
    closeOnEscape: false,
    open: function (event, ui) {
        $("#myDivForLoadingDialog").prev().hide();
    }
})

without setting button in the option it does not show any button inside

set closeOnEscape: false to avoid your loading message been closed by "esc" button

in the opencallback hide alle the title box (and the close button it has inside).

I prefer to avoid drag, resize and all features not needed by loading message.

it works with jQuery 1.11.1 (and maybe with all previous version)