
Below is the sample code of above functionality:-
<apex:page standardController="Account"> <apex:includeScript value="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js" /> <apex:slds ></apex:slds> <apex:form > <h1>For Single Field</h1> <apex:inputField value="{!Account.Name}" styleclass="slds-input firstInput"/> <br /> <button type="button" class="slds-button slds-button_brand" onclick="Desabled(); return false;">Desabled</button> <button type="button" class="slds-button slds-button_brand" onclick="Enabled(); return false;">Enabled</button> <script> function Desabled(){ $('.firstInput')[0].disabled = true; } function Enabled(){ $('.firstInput')[0].disabled = false; } </script> <h1>For Multiple Field(jQuery version 1.6+ )</h1> <apex:inputField value="{!Account.Name}" styleclass="slds-input allFields"/><br /> <apex:inputField value="{!Account.AccountSource}" styleclass="slds-input allFields"/><br /> <br /> <apex:inputField value="{!Account.AccountNumber}" styleclass="slds-input allFields"/><br /> <br /> <button type="button" class="slds-button slds-button_brand" onclick="DesabledAll(); return false;">Desabled</button> <button type="button" class="slds-button slds-button_brand" onclick="EnabledAll(); return false;">Enabled</button> <br /> <script> function DesabledAll(){ $('.allFields').prop('disabled',true); } function EnabledAll(){ $('.allFields').prop('disabled',false); } </script> <h1>For Multiple Field(jQuery version 1.5 and below)</h1> <apex:inputField value="{!Account.Name}" styleclass="slds-input allFieldAttr"/><br /> <apex:inputField value="{!Account.AccountSource}" styleclass="slds-input allFieldAttr"/><br /> <br /> <apex:inputField value="{!Account.AccountNumber}" styleclass="slds-input allFieldAttr"/><br /> <br /> <button type="button" class="slds-button slds-button_brand" onclick="DesabledAllAttr(); return false;">Desabled</button> <button type="button" class="slds-button slds-button_brand" onclick="EnabledAllAttr(); return false;">Enabled</button> <script> function DesabledAllAttr(){ $('.allFieldAttr').attr('disabled','disabled'); } function EnabledAllAttr(){ $('.allFieldAttr').removeAttr('disabled'); } </script> </apex:form> </apex:page>
HAPPY LEARNING