0

I am trying to disable a submit button after the first click on a VisualForce page. I would think the code I am using should work, but it is not. I am able to click on the button multiple times. Could anyone help me identify where the issue is?

<script type="text/javascript">
    $('button[id$=submitButton]').on('click', function(){
      $('button[id$=submitButton]').attr("disabled", true);
    });    
</script>

<apex:commandLink id="submitButton" value="{!$Label.Disaster_Submit}" action="{!saveConsent}" styleClass="btn btn-fill btn-danger btn-wd btn-sm"></apex:commandLink>
Improve this question
1

1 Answer 1

Reset to default
0

I see that you are using <apex:commandLink> I think for you to disable this you would need to use <apex:commandButton>

Improve this answer
5
  • Thank you for the feedback. That actually did resolve the button issue. Would you happen to know why this jquery may not excecute if it replaces the code inside my script tags? $('input[id$=submitButton]').on('click', function(){ $('input[id$=submitButton]').attr('disabled','disabled');
    – Ivo Dimov
    Mar 20, 2019 at 21:33
  • it looks like you are trying to find an input field with the id of "submitButton"? this would mean if your button is created like so: '<apex:commandButton id="submitButton"></apex:commandButton>' The button wouldn't be found. If you had this: '<apex:inputField id="submitButton"></apex:inputField>' the JS you posted SHOULD find it.
    – Bill Sutton
    Mar 21, 2019 at 0:40
  • Thank you for the info Bill.I am no JS expert by any means, but when I tested button vs input, it seems like only 'inut' is working. If I run this, on page load, by button is grayed out: $( document ).ready(function(){ $('input[id$=submitButton]').attr('disabled','disabled'); }); Unfortunately, I can not use the code above, as I am trying to disable the button after it was clicked, but my original code still does not execute.
    – Ivo Dimov
    Mar 21, 2019 at 12:27
  • <apex:page> <apex:includeScript value="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"/> <script type="text/javascript"> $(document).ready(function(){ $('input[id$=submitButton]').click(function(){ $('input[id$=submitButton]').attr("disabled", true); return false; }); }); </script> <apex:form> <apex:commandButton disabled="false" id="submitButton" value="testValue" action="{!}" styleClass="btn btn-fill btn-danger btn-wd btn-sm"></apex:commandButton> </apex:form> </apex:page>
    – Bill Sutton
    Mar 28, 2019 at 19:17
  • the above code disables you from clicking the button twice, You might need to adjust the css to make it look disabled
    – Bill Sutton
    Mar 28, 2019 at 19:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.