Skip to main content
S
straffenp
Known Participant
March 3, 2011
Question

Disable form/submit button

  • March 3, 2011
  • 2 replies
  • 2422 views

Hi all,

I am outputting some records with form checkboxes so a user can delete multiple records at a time.  I'm trying to figure out a way to disable the submit button for the form until at least one checkbox is checked.  The name of each checkbox is unique using the record id.  Any help is greatly appreciated!  Thank you!

    This topic has been closed for replies.

    2 replies

    P
    pirula08
    Inspiring
    March 7, 2011

    Here you go, experiment with this

    <form action="" method="get">

    <input name="a" type="checkbox" value=""  id="id" onclick="if(a.checked || a1.checked || a2.checked) b.disabled=false; else b.disabled=true; "/>
    <input name="a1" type="checkbox" value="" id="id1" onclick="if(a1.checked || a.checked || a2.checked) b.disabled=false; else b.disabled=true; "/>
    <input name="a2" type="checkbox" value="" id="id2" onclick="if(a2.checked || a.checked || a1.checked) b.disabled=false; else b.disabled=true; "/>
    <input name="b" type="button" disabled="true" value="button">

    </form>

    WolfShade
    WolfShade
    Legend
    March 4, 2011

    That's not a CF (server-side) function; that's a JavaScript (client-side) function, but I can show you.

    (It would be easier if all the checkboxes have the same name; this would create a "list" of ids that can be deleted, and would allow me to check against array length, but I'll see what I can do.)

    Give me a few moments.

    ^_^

    WolfShade
    WolfShade
    Legend
    March 4, 2011

    This will work, as is, if there is only the ONE form on the page.  I think.. I haven't tested it.  You might need to tweak it.

    <script type="text/javascript">
    <!--
    function EDsubmit() {
         var inputArray = document.getElementsByTagName("input"); // gets all input elements - text, password, radio, checkbox, etc.
         var inputArrayLen = inputArray.length, totChecked = 0;
         for(i=0; i<inputArrayLen; i++) { // Loops through all INPUTs
              switch(inputArray.type) {
                   case "checkbox": // We are only concerned with CHECKBOX inputs
                        inputArray.checked == true ? totChecked++ : null ;
                   break;
                   default: // .. and ignore all others
                   break;
                   }
              }
              document.forms[0].submit.disabled = totChecked == 0 ? true : false ;
         }
    //-->
    </script>

    Set this to run on page load, and also apply it to each checkbox in the "onchange" event.

    LMK

    ^_^

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices