+ Start a Discussion
ravikanth321ravikanth321 

Disabling Both Top and Bottom Buttons Of PageBlockButtons During OnClick Event.

Hi I am Using Page Block Buttons Instead Of CommandButtons To Dispaly Buttons On Both Top and Bottom,I Have a Requirement where I have to Disable Button OnClick ,So We Can avoid Multiple Submissions.I Tried With PageBlock Buttons Disabling Is Working Fine But Onclick If any Button Either Top or Buttom i have to Disable Booth Buttoms...Any Ideas Plz...??? TIA.


<apex:pageBlock title="Test" id="pgblk">

<apex:pageMessages />

<apex:pageBlockButtons >
<apex:commandButton action="{!cancel}" value="Cancel"/>
<!--<apex:commandButton value="Convert" id="Convert"  action="{!convertLeadFunction}" />-->
<apex:commandButton value="Convert" action="{!convertLeadFunction}" onclick="disable" reRender="pgblk"/>


<!--<apex:commandButton value="Convert" action="{!convertLeadFunction}" onclick="alert('Please Wait Until Lead Gets Converted');"  /> -->

<!--<apex:actionStatus id="saveStatus">
    <apex:facet name="stop">
        <apex:commandButton value="Convert" action="{!convertLeadFunction}" status="saveStatus" rerender="saveParentBlock" />
    </apex:facet>
    <apex:facet name="start">
        <apex:commandButton value="Please Wait While Converting" disabled="true" status="saveStatus" rerender="saveParentBlock" />
    </apex:facet>
</apex:actionStatus> -->



</apex:pageBlockButtons>
</apex:pageBlock>
 
Best Answer chosen by ravikanth321
Rajiv Penagonda 12Rajiv Penagonda 12
Rashmi, you are trying to implement a client side logic, and doing a server side coding using controller will NOT help.

Best way to achieve this is through javascript. Take a look at the below extract of your code. I have updated it with javascript logic using jQuery:
 
<script>
	function disableAllVFButtons() {
		var jnc = jQuery.noConflict();
		
		jnc(".cvf_button").each(function(argIndex, argEle) {
			jnc(this).prop('disabled', true);
		});
	}
</script>
<apex:pageBlockButtons >
	<apex:commandButton action="{!cancel}" value="Cancel" styleClass="cvf_button" onclick="disableAllVFButtons();" />
	<apex:commandButton value="Convert" action="{!convertLeadFunction}" onclick="disableAllVFButtons();" reRender="pgblk" styleClass="cvf_button" />
</apex:pageBlockButtons>

The summary of the fix is as follows:
1. Set a styeclass to each of the buttons so that it provides a handle for accessing them from within javascript/jQuery.
2. Write a javascript function to handle button disable operation.
3. In each of the buttons, onclick invoke the javascript function.

Do note that the code is draft and I haven't tried compiling/running. But I certainly hope it guides you in the right direction.

All Answers

Pramodh KumarPramodh Kumar
Rashmi Khanna,

Hey i wrote some code to disable the button on the onclick event using the boolean variable and here is the snippet.

Please let me know if you need any other help.
 
public with sharing class disableButtons {
    public boolean diableButttonFlag{get;set;}
    
    public disableButtons(){
       diableButttonFlag = false; 
    }
    

    public void disableButton() {
        diableButttonFlag = true;
        try
        {
            //diableButttonFlag = false;
        }
        catch(exception e){
            
        }
    }
}
 
<apex:page controller="disableButtons">
    <apex:form >
        <apex:pageBlock id="block">
            <apex:pageBlockButtons >
                <apex:commandButton disabled="{!diableButttonFlag}" value="save" action="{!disableButton}" reRender="block"/>
            </apex:pageBlockButtons>
        </apex:pageBlock>
    </apex:form>
</apex:page>


Thanks,
pRAMODH.
 
ravikanth321ravikanth321
Hi Pramodh Its not working as expected,Could You Please Suggest me ..
Rajiv Penagonda 12Rajiv Penagonda 12
Rashmi, you are trying to implement a client side logic, and doing a server side coding using controller will NOT help.

Best way to achieve this is through javascript. Take a look at the below extract of your code. I have updated it with javascript logic using jQuery:
 
<script>
	function disableAllVFButtons() {
		var jnc = jQuery.noConflict();
		
		jnc(".cvf_button").each(function(argIndex, argEle) {
			jnc(this).prop('disabled', true);
		});
	}
</script>
<apex:pageBlockButtons >
	<apex:commandButton action="{!cancel}" value="Cancel" styleClass="cvf_button" onclick="disableAllVFButtons();" />
	<apex:commandButton value="Convert" action="{!convertLeadFunction}" onclick="disableAllVFButtons();" reRender="pgblk" styleClass="cvf_button" />
</apex:pageBlockButtons>

The summary of the fix is as follows:
1. Set a styeclass to each of the buttons so that it provides a handle for accessing them from within javascript/jQuery.
2. Write a javascript function to handle button disable operation.
3. In each of the buttons, onclick invoke the javascript function.

Do note that the code is draft and I haven't tried compiling/running. But I certainly hope it guides you in the right direction.
This was selected as the best answer
ravikanth321ravikanth321
Thank You Rajiv Worked Like Charm.
ravikanth321ravikanth321
One Small Help ,IT Worked Is there any Way To Show Message To User Like "Please Wait While Converting "(On The Same Disabled Button)


Like Below. On Click Of Either Top Or Bottom "Convert" Button ,Both Buttons must Diasabled "Convert " Buutton and Should Show This Message "Please Wait While Converting"
On That Disabled Buttons User-added image
Rajiv Penagonda 12Rajiv Penagonda 12
See if this works:
function disableAllVFButtons() {
		var jnc = jQuery.noConflict();
		
		jnc(".cvf_button").each(function(argIndex, argEle) {
			jnc(this).prop('disabled', true);
			jnc(this).prop('value', 'Please Wait While Converting');
		});
	}

There is a new entry at line 6 to show user message.
ravikanth321ravikanth321
Thanks Rajiv,It Worked .