How to disable and enable button in Visualforce page in Salesforce?

HomeInfallibleTechie Admin

How to disable and enable button in Visualforce page in Salesforce?

InfallibleTechie Admin
Sample Code:


Visualforce page:


<apex:page sidebar=”false” Controller=”Sample” showHeader=”true” id=”pg”>
    <script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js” type=”text/javascript”></script> 
    <script>
        var $ = jQuery.noConflict();
        function btnClick() {           
            $(‘input[id*=confirmBtn]’).attr(‘value’,’Saving…’);
            $(‘input[id*=confirmBtn]’).attr(‘class’, ‘btnDisabled’);
            callShow();
        }
        
        function btnComplete(){
            $(‘input[id*=confirmBtn]’).attr(‘value’,’Saved’);
            $(‘input[id*=confirmBtn]’).attr(‘class’, ‘btn’);
            return true;
        }
    </script>
    <apex:form id=”frm”>
        <apex:actionFunction name=”callShow” action=”{!show}”/>        
        <apex:outputText value=”{!temp}”/>
        <br/>
        <apex:commandButton id=”confirmBtn” value=”Save” onclick=”btnClick();” oncomplete=”btnComplete();” reRender=”frm”/>
    </apex:form>
</apex:page>


Apex controller:


public class Sample {   
    public String temp {get;set;}
    public sample() {
    }
    public pagereference show() {
        temp = ‘Testing’;
        return null;
    }
}


Output:



Before clicking the Button:

While Button processing:

After clicking the Button:

Leave a Reply