Question

How can i disable the jquery UI dialog buttons like :

   $("#dialog").dialog({ width: 500, modal: true, show: 'drop', hide: 'drop',
        buttons: {
            "Next": function () {/* do something */ },
            "Finish" : function {/* do something */ } 
        }
    });

I want to keep disabled the Next button until user selects some radio button or checkbox and when user will select any of then 'Next button will enabled'. (Same behavior which we can see when we install any new software.).How can i do this?

Answer 1

You can use firebug or inspect element from google chrome then find next button id or css rule… I mean a correct selector to the button then you can always call

$("Nextbutton selector").attr('disabled','disabled');

re enable by

$("Nextbutton selector").removeAttr('disabled');

hope this help

PS:
When inspect i saw

<button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" type="button" role="button" aria-disabled="false">
<span class="ui-button-text">Next</span>
</button>

so you can call

$('button.ui-button:contains("Next")').attr....