Disabling multiple clicks to process button

Peter Kaizer

Looking for an elegant way to not allow donors to hit the "submit" or "process" button on a donation form.  Anyone have a good solution.

mark.ajws

A script like this should be able to disable the submit button after one click and still allow the request to go through.  In jQuery:

$('input').one('click',function(){$(this).attr('disabled',true)})

Robert Saunders

mark.ajws :

A script like this should be able to disable the submit button after one click and still allow the request to go through.  In jQuery:

$('input').one('click',function(){$(this).attr('disabled',true)})

Where would place this code though? The process/submit buttons are system-generated.

mark.ajws

Robert Saunders:

Where would place this code though? The process/submit buttons are system-generated.

Place it within the following snippet in the head element and make sure you have also included the jQuery library.

<script type="text/javascript">
$(document).ready(function(){
     //previous script code here
})
</script>

This approach would disable the button functionality from the front-end, but wont prevent the elements from actually being generated.  You could use a similar script or css to hide the buttons entirely.

Noah Cooper

mark.ajws :

Place it within the following snippet in the head element and make sure you have also included the jQuery library.

<script type="text/javascript">
$(document).ready(function(){
     //previous script code here
})
</script>

This approach would disable the button functionality from the front-end, but wont prevent the elements from actually being generated.  You could use a similar script or css to hide the buttons entirely.

You could also do this with Convio's JavaScript library, Utils.js,  which is automatically included in every Convio Online Marketing and CMS  page. No need for another library.

<script type="text/javascript">
addOnLoadHandler(function(){
     var i;
     var allForms=document.getElementsByTagName('form');
     for(i in allForms){
          Utils.addEvent(allForms,'submit',function(evt){
               var e=(evt)?evt:window.event;
               var elm=(e.target)?e.target:e.srcElement;
               var allInputs=elm.getElementsByTagName('input');
               for(j in allInputs){
                    if(allInputs.type&&allInputs.type=='submit')
                         allInputs.disabled=true;
               }
          });
     }
});
</script>

mark.ajws

Noah Cooper:

You could also do this with Convio's JavaScript library, Utils.js,  which is automatically included in every Convio Online Marketing and CMS  page. No need for another library.

<script type="text/javascript">
addOnLoadHandler(function(){
     var i;
     var allForms=document.getElementsByTagName('form');
     for(i in allForms){
          Utils.addEvent(allForms,'submit',function(evt){
               var e=(evt)?evt:window.event;
               var elm=(e.target)?e.target:e.srcElement;
               var allInputs=elm.getElementsByTagName('input');
               for(j in allInputs){
                    if(allInputs.type&&allInputs.type=='submit')
                         allInputs.disabled=true;
               }
          });
     }
});
</script>

Hey Noah,

Is there any documentation for the Utils.js library?