Disable a button in a jQuery modal dialog while loading

Question

Hi,
I'm new to JQuery.I have a jQuery dialog. In this form, I have a "Save" button. I would like this "Save" button to be disabled while the modal dialog open or from a function.

The code i wrote to create this button is given below. However, I don't know how to enable and disable the dialog button from a function or at the time of loading the dialog. What should I do?

$('#divAddExpense').dialog({
modal: true,
autoOpen: false,
height: 'auto',
width: 650,
draggable: true,
position: 'center',
resizable: false,
buttons: { "Close": function () { $(this).dialog('close'); },
"Save": function (evt) {
//Save click code here
},
close: function () {
//some code
}
});

Plz help me out.

Amit Choudhary · Answer

Here's the function that can disable the button on dialog: function getDialogButton ( dialog_selector , button_name ) { var buttons = $ ( dialog_selector + ' .ui-dialog-buttonpane button' ); for ( var i = 0 ; i buttons . length ; ++ i ) { var jButton = $ ( buttons [ i ] ); if ( jButton . text () == button_name ) { return jButton ; } } return null ; } you just need to pass your dialog selector and button name and it'll get disable based on you condition for e.g. // now programmatically get the submit button and disable it var button = getDialogButton ( '.dialog1' , 'Submit' ); if ( button ) { button . attr ( 'disabled' , 'disabled' ). addClass ( 'ui-state-disabled' ); }

Amit Choudhary · Answer

Hi Saroj, you should not say things like this to your friends here. Riyaz tried to helped you with your problem may be he didn't get it right if you think he's not understood then you can explain him. you should be polite to the person who is trying to help you.

Saroj Kumar Sahu · Answer

Hello Riyaz, thnks for reply.The answer u have given,do u know when it'll execute.i think u didnt get my question properly.so plz dont answer like this.

Riyaz Akhtar · Answer

try below code: var buttonDomElement; $(function() { $("#dialog").dialog({ height: 'auto', width: 700, modal: true, buttons: { 'Save': function(evt) { // get DOM element for button buttonDomElement = evt.target; // Disable the button $(buttonDomElement).attr('disabled', true); $('form').submit(); }, 'Enable Save': function() { // $(this).dialog('close'); $(buttonDomElement).attr('disabled', false); } } }); });

Sanjeeb Lenka · Answer

check this link: http://stackoverflow.com/questions/577548/how-can-i-disable-a-button-in-a-jquery-dialog-from-a-function it may help you

Disable a button in a jQuery modal dialog while loading

Insert Link

Embed YouTube Video

Table Options

Insert Image

Answers (5)