How to hide button on the Jquery UI dialog box [duplicate]

Question

I have been using JQuery UI dialog box.The following code I am using.Can any one please let me know how to hide the Export button after click

$( "#dialog-confirm1" ).dialog({
            resizable: false,
            height:350,
            width:650,
            modal: false,
            autoOpen:false,
            buttons: {
                "Export": function() {
                    exportCSV(2);


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

Answer 1

The documentation for the buttons option says:

The context of the callback is the dialog element; if you need access to the button, it is available as the target of the event object.

Therefore, you can use event.target to refer to the button element:

buttons: {
    "Export": function(event) {
        $(event.target).hide();
        exportCSV(2);
    },
    "Cancel": function() {
        $(this).dialog("close");
    }
}

Answer 2

You could use $('.ui-button:contains(Export)').hide(): (the following code hides the export button when you click it)

$( "#dialog-confirm1" ).dialog({
            resizable: false,
            height:350,
            width:650,
            modal: false,
            autoOpen:false,
            buttons: {
                "Export": function() {
                    exportCSV(2);
                    $(event.target).hide();


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