Discussions

Extending Eloqua 10 Form Validation

13

Comments

  • bkhayes
    bkhayes Bloomington, MNPosts: 59 Silver Medal

    This thread was a great resource in helping to solve how to make a checkbox required on Eloqua 10 forms.

    The code belowRyan Wheler-Oracle) . Please note that the bold areas are what needs to be swapped out with your specific field. For example, if field 4 on your form is a checkbox that is required you must change "field6" and "dom6" to "field4" and "dom4". You will also need to swap the "#form2398" with your specific form's ID. If you run into issues I would make sure that the field your checkbox is in is correct. Eloqua forms start with dom0, field0.

    <!-- Load jQuery 1.12.4.min.js -->

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>


    <!-- Make Checkboxes Required on Eloqua Forms -->

    <script type="text/javascript">

         $(document).ready(function() {  // DOM Ready

              var dom6 = document.querySelector("#form2398 input[type='checkbox']");var field6 = new LiveValidation(dom6, {validMessage: "", onlyOnBlur: false, wait: 300});field6.add(Validate.Acceptance, {failureMessage:"This field is required"});

          }); // End DOM

    </script>

  • This thread was a great resource in helping to solve how to make a checkbox required on Eloqua 10 forms.

    The code belowRyan Wheler-Oracle) . Please note that the bold areas are what needs to be swapped out with your specific field. For example, if field 4 on your form is a checkbox that is required you must change "field6" and "dom6" to "field4" and "dom4". You will also need to swap the "#form2398" with your specific form's ID. If you run into issues I would make sure that the field your checkbox is in is correct. Eloqua forms start with dom0, field0.

    <!-- Load jQuery 1.12.4.min.js -->

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>


    <!-- Make Checkboxes Required on Eloqua Forms -->

    <script type="text/javascript">

         $(document).ready(function() {  // DOM Ready

              var dom6 = document.querySelector("#form2398 input[type='checkbox']");var field6 = new LiveValidation(dom6, {validMessage: "", onlyOnBlur: false, wait: 300});field6.add(Validate.Acceptance, {failureMessage:"This field is required"});

          }); // End DOM

    </script>

    I'm happy that you found the post helpful. Mark set me on the right path. All credit goes to him. Here is a jfiddle of my final form. I hope that you find it helpful as well:

    Floating 1 Form between divs - JSFiddle

    Cheers,

    -V

  • Hope someone can help me out with this - I need to make a single checkbox required, and I've tried a lot of the options above, but I can't get any of them to work. The problem is not so much that the scripts don't work, but that Eloqua seems to overwrite any changes to the form code with the original. I reckon I might be able to put the script outside the form code, but the input for my checkbox doesn't have an ID. Can I give it one via JS that's outside of the form's default code, so I can get the code to work?

  • bkhayes
    bkhayes Bloomington, MNPosts: 59 Silver Medal

    Hi Bob,

    If you use my method from above you should be able to get it to work. Just make sure you have the right field number and match that with the dom number. The first field on the form starts with 0 so if you have first name, last name, single check box the checkbox would be "field2", "dom2". Also please note that you need to place this script towards the bottom of the page (not in replace of the Eloqua form validation that exists after the form).

    <!-- Load jQuery 1.12.4.min.js -->

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

    <!-- Make Checkboxes Required on Eloqua Forms -->

    <script type="text/javascript">

         $(document).ready(function() {  // DOM Ready

              var dom# = document.querySelector("#form#### input[type='checkbox']");var field# = new LiveValidation(dom#, {validMessage: "", onlyOnBlur: false, wait: 300});field#.add(Validate.Acceptance, {failureMessage:"This field is required"});

          }); // End DOM

    </script>

    Let me know if this works!

    Ben

  • Hi Bob,

    If you use my method from above you should be able to get it to work. Just make sure you have the right field number and match that with the dom number. The first field on the form starts with 0 so if you have first name, last name, single check box the checkbox would be "field2", "dom2". Also please note that you need to place this script towards the bottom of the page (not in replace of the Eloqua form validation that exists after the form).

    <!-- Load jQuery 1.12.4.min.js -->

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

    <!-- Make Checkboxes Required on Eloqua Forms -->

    <script type="text/javascript">

         $(document).ready(function() {  // DOM Ready

              var dom# = document.querySelector("#form#### input[type='checkbox']");var field# = new LiveValidation(dom#, {validMessage: "", onlyOnBlur: false, wait: 300});field#.add(Validate.Acceptance, {failureMessage:"This field is required"});

          }); // End DOM

    </script>

    Let me know if this works!

    Ben

    Hi Ben,

    Thanks so much, this works swimmingly! Apart from one little thing: the error message when the field is not checked is displayed over the checkbox itself, making it impossible to check it. It seems similar to what @mhalliday posted way back in his OP, about insertAfterWhatNode, but I'm not really sure where to put that bit in your script. If that's even the right solution at all.

    Can you help me out?

    Thanks!

  • bkhayes
    bkhayes Bloomington, MNPosts: 59 Silver Medal

    Hi Ben,

    Thanks so much, this works swimmingly! Apart from one little thing: the error message when the field is not checked is displayed over the checkbox itself, making it impossible to check it. It seems similar to what @mhalliday posted way back in his OP, about insertAfterWhatNode, but I'm not really sure where to put that bit in your script. If that's even the right solution at all.

    Can you help me out?

    Thanks!

    Hi Bob,

    In the code where you see: "failureMessage:'This field is required'" change the error message to blank "". If this doesn't solve your issue let me know. There may be a CSS solution to it.

    Best,

    Ben

  • Hi Bob,

    In the code where you see: "failureMessage:'This field is required'" change the error message to blank "". If this doesn't solve your issue let me know. There may be a CSS solution to it.

    Best,

    Ben

    Hi Ben,

    Thanks - but I do want to display an error message, so leaving it blank is not an option. It's just that I want it positioned elsewhere (i.e., not covering the checkbox itself). I'm thinking CSS as well, it's just that I'm not sure how to put that in there as I'm no JS expert.

    Regards,

    Bob

  • bkhayes
    bkhayes Bloomington, MNPosts: 59 Silver Medal

    Hi Ben,

    Thanks - but I do want to display an error message, so leaving it blank is not an option. It's just that I want it positioned elsewhere (i.e., not covering the checkbox itself). I'm thinking CSS as well, it's just that I'm not sure how to put that in there as I'm no JS expert.

    Regards,

    Bob

    Hey Bob,

    If you can supply a link to what you are working on I may be able to assist you with CSS that could position it. I am going to guess that it would be setting some margin in CSS to the error message itself to move it away from covering it.

    Best,

    Ben

  • mcalnan
    mcalnan Boulder, COPosts: 15 Silver Medal

    Hi Bob,

    If you use my method from above you should be able to get it to work. Just make sure you have the right field number and match that with the dom number. The first field on the form starts with 0 so if you have first name, last name, single check box the checkbox would be "field2", "dom2". Also please note that you need to place this script towards the bottom of the page (not in replace of the Eloqua form validation that exists after the form).

    <!-- Load jQuery 1.12.4.min.js -->

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

    <!-- Make Checkboxes Required on Eloqua Forms -->

    <script type="text/javascript">

         $(document).ready(function() {  // DOM Ready

              var dom# = document.querySelector("#form#### input[type='checkbox']");var field# = new LiveValidation(dom#, {validMessage: "", onlyOnBlur: false, wait: 300});field#.add(Validate.Acceptance, {failureMessage:"This field is required"});

          }); // End DOM

    </script>

    Let me know if this works!

    Ben

    This worked perfectly for me as well Ben @bkhayes thank you! I've seen folks reference radio button validation as well, do you have any insight into how to adjust your code to make it work in that instance as well? I tried in my super limited coding experience to no avail. Thanks in advance!

  • bkhayes
    bkhayes Bloomington, MNPosts: 59 Silver Medal

    This worked perfectly for me as well Ben @bkhayes thank you! I've seen folks reference radio button validation as well, do you have any insight into how to adjust your code to make it work in that instance as well? I tried in my super limited coding experience to no avail. Thanks in advance!

    Hi Mcalnan,

    You could try the code below. Not sure if it will work but hopefully it gives you a starting point. The bold underlined portion is the part I changed. Instead of "checkbox" place in "radio".

    <!-- Load jQuery 1.12.4.min.js -->

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

    <!-- Make Checkboxes Required on Eloqua Forms -->

    <script type="text/javascript">

         $(document).ready(function() {  // DOM Ready

              var dom# = document.querySelector("#form#### input[type='radio']");var field# = new LiveValidation(dom#, {validMessage: "", onlyOnBlur: false, wait: 300});field#.add(Validate.Acceptance, {failureMessage:"This field is required"});

          }); // End DOM

    </script>

    If that doesn't work it may require a different validate type then "Validate.Acceptance". I would have to experiment with it further.

  • mcalnan
    mcalnan Boulder, COPosts: 15 Silver Medal

    Thanks @bkhayes, I did try adjusting the value to radio, as well as a few other iterations, such as radios, radio-buttons, and radio-button with no success. I've found other sources online through generic web search but everything I seem to find requires HTML5, which isn't firing properly when I try it out.  If you ever get a solution that would be great, but I'll continue to try different solutions I find, thanks!

  • bkhayes
    bkhayes Bloomington, MNPosts: 59 Silver Medal

    Thanks @bkhayes, I did try adjusting the value to radio, as well as a few other iterations, such as radios, radio-buttons, and radio-button with no success. I've found other sources online through generic web search but everything I seem to find requires HTML5, which isn't firing properly when I try it out.  If you ever get a solution that would be great, but I'll continue to try different solutions I find, thanks!

    Hey Mcalnan,

    Sorry that it didn't get you 100% of the way to a solution.

    You could try something like this:

    HTML5: How to use the "required" attribute with a "radio" input field - Stack Overflow

    I would suggest having one radio check in place when you first start out. Otherwise the user cannot turn back to the state of all unchecked.

    Best,

    Ben

  • mcalnan
    mcalnan Boulder, COPosts: 15 Silver Medal

    Hey Mcalnan,

    Sorry that it didn't get you 100% of the way to a solution.

    You could try something like this:

    HTML5: How to use the "required" attribute with a "radio" input field - Stack Overflow

    I would suggest having one radio check in place when you first start out. Otherwise the user cannot turn back to the state of all unchecked.

    Best,

    Ben

    I did try that route as well but no luck yet...I'm guessing I'm missing a comma or a div tag or something simple. I'm taking a crash course in jquery and js to try and figure it out, thanks!

  • This thread was a great resource in helping to solve how to make a checkbox required on Eloqua 10 forms.

    The code belowRyan Wheler-Oracle) . Please note that the bold areas are what needs to be swapped out with your specific field. For example, if field 4 on your form is a checkbox that is required you must change "field6" and "dom6" to "field4" and "dom4". You will also need to swap the "#form2398" with your specific form's ID. If you run into issues I would make sure that the field your checkbox is in is correct. Eloqua forms start with dom0, field0.

    <!-- Load jQuery 1.12.4.min.js -->

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>


    <!-- Make Checkboxes Required on Eloqua Forms -->

    <script type="text/javascript">

         $(document).ready(function() {  // DOM Ready

              var dom6 = document.querySelector("#form2398 input[type='checkbox']");var field6 = new LiveValidation(dom6, {validMessage: "", onlyOnBlur: false, wait: 300});field6.add(Validate.Acceptance, {failureMessage:"This field is required"});

          }); // End DOM

    </script>

    Hi Ben

    Thanks for this great code. It helped perfectly. What can I do if I need multiple checkboxes to be required. None of the other tips worked for me. I need a required box for the following question:

    - 4 Options / 2 have to be picked.

    Workshop A

    Workshop B

    Workshop C

    Workshop D

    -> they have to select 2

    How can I code this? Where do I have to place it in my landing page code?

    Thank you so much for your help.

    Cheers

    Natalie

  • 3341989
    3341989 Digital Consultant Posts: 6

    Hi Bob,

    If you use my method from above you should be able to get it to work. Just make sure you have the right field number and match that with the dom number. The first field on the form starts with 0 so if you have first name, last name, single check box the checkbox would be "field2", "dom2". Also please note that you need to place this script towards the bottom of the page (not in replace of the Eloqua form validation that exists after the form).

    <!-- Load jQuery 1.12.4.min.js -->

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

    <!-- Make Checkboxes Required on Eloqua Forms -->

    <script type="text/javascript">

         $(document).ready(function() {  // DOM Ready

              var dom# = document.querySelector("#form#### input[type='checkbox']");var field# = new LiveValidation(dom#, {validMessage: "", onlyOnBlur: false, wait: 300});field#.add(Validate.Acceptance, {failureMessage:"This field is required"});

          }); // End DOM

    </script>

    Let me know if this works!

    Ben

    Hi Ben

    Thanks for this great code. It helped perfectly. What can I do if I need multiple checkboxes to be required. None of the other tips worked for me. I need a required box for the following question:

    - 4 Options / 2 have to be picked.

    Workshop A

    Workshop B

    Workshop C

    Workshop D

    -> they have to select 2

    How can I code this? Where do I have to place it in my landing page code?

    Thank you so much for your help.

    Cheers

  • bkhayes
    bkhayes Bloomington, MNPosts: 59 Silver Medal

    Hi Ben

    Thanks for this great code. It helped perfectly. What can I do if I need multiple checkboxes to be required. None of the other tips worked for me. I need a required box for the following question:

    - 4 Options / 2 have to be picked.

    Workshop A

    Workshop B

    Workshop C

    Workshop D

    -> they have to select 2

    How can I code this? Where do I have to place it in my landing page code?

    Thank you so much for your help.

    Cheers

    Natalie

    Hi Natalie,

    Hope this helps!

    Place the following code right before the ending </body> tag on the landing page HTML. The bold and underlined number is where you can change the number of required checkboxes. Then you just have to change the alert message to the number of desired checkboxes. Also, don't forget to include the jQuery library that was provided below.

    <!-- jQuery 1.12.4 -->

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js "></script>

    <!-- Script That Makes At Least Two Checkboxes Required On An Eloqua 10 Form -->

    <script type="text/javascript">

    $(document).ready(function() {

      $('input[type=submit]').click(function() {

        checked = $("input[type=checkbox]:checked").length;

         <!-- Change the number below to the desired amount of required checkboxes -->

        if (checked !== 2) {

         <!-- Change this alert message to warn about the desired amount of required checkboxes -->

          alert("You must check at least two checkboxes.");

          return false;

        }

      });

    });

    </script>

  • bkhayes
    bkhayes Bloomington, MNPosts: 59 Silver Medal

    Hi Natalie,

    Hope this helps!

    Place the following code right before the ending </body> tag on the landing page HTML. The bold and underlined number is where you can change the number of required checkboxes. Then you just have to change the alert message to the number of desired checkboxes. Also, don't forget to include the jQuery library that was provided below.

    <!-- jQuery 1.12.4 -->

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js "></script>

    <!-- Script That Makes At Least Two Checkboxes Required On An Eloqua 10 Form -->

    <script type="text/javascript">

    $(document).ready(function() {

      $('input[type=submit]').click(function() {

        checked = $("input[type=checkbox]:checked").length;

         <!-- Change the number below to the desired amount of required checkboxes -->

        if (checked !== 2) {

         <!-- Change this alert message to warn about the desired amount of required checkboxes -->

          alert("You must check at least two checkboxes.");

          return false;

        }

      });

    });

    </script>

    *UPDATED ANSWER*

    If you want to make it easier you can use this instead. Simply place before ending </body> tag in HTML and change requiredChecked to your desired amount. This code is set to two.

    <!-- jQuery 1.12.4 -->

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js "></script>

    <!-- Script That Makes A Set Amount Of Checkboxes Required On An Eloqua 10 Form -->

    $(document).ready(function() {

      $('input[type=submit]').click(function() {

        checked = $("input[type=checkbox]:checked").length;

        <!-- Change This To Your Desired Amount Of Required Checkboxes -->

        requiredChecked = 2;

        if (checked !== requiredChecked) {

          alert("You must check at least" + " " + requiredChecked + " " + "checkboxes.");

          return false;

        }

      });

    });

  • 3341989
    3341989 Digital Consultant Posts: 6

    *UPDATED ANSWER*

    If you want to make it easier you can use this instead. Simply place before ending </body> tag in HTML and change requiredChecked to your desired amount. This code is set to two.

    <!-- jQuery 1.12.4 -->

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js "></script>

    <!-- Script That Makes A Set Amount Of Checkboxes Required On An Eloqua 10 Form -->

    $(document).ready(function() {

      $('input[type=submit]').click(function() {

        checked = $("input[type=checkbox]:checked").length;

        <!-- Change This To Your Desired Amount Of Required Checkboxes -->

        requiredChecked = 2;

        if (checked !== requiredChecked) {

          alert("You must check at least" + " " + requiredChecked + " " + "checkboxes.");

          return false;

        }

      });

    });

    Hi Ben

    Thank you so much for your quick help, but unfortunately it didnt work. I placed it right before </body>.  I just placed it at the end of the HTML. Please see pic below

    pastedImage_0.png

    My form looks like this

    pastedImage_1.png

    I just remember that for the single checkbox we had to add the form and field number info. How does the form know we mean this field? Is that automatically?

    Sorry, but I am totally new to the coding landscape. Thank you so much for your help.

    Best wishes

    Daniela

  • bkhayes
    bkhayes Bloomington, MNPosts: 59 Silver Medal

    Hi Ben

    Thank you so much for your quick help, but unfortunately it didnt work. I placed it right before </body>.  I just placed it at the end of the HTML. Please see pic below

    pastedImage_0.png

    My form looks like this

    pastedImage_1.png

    I just remember that for the single checkbox we had to add the form and field number info. How does the form know we mean this field? Is that automatically?

    Sorry, but I am totally new to the coding landscape. Thank you so much for your help.

    Best wishes

    Daniela

    Hey,

    Notice on the HTML editor how the JavaScript is in white? That means that it isn't surrounded by the proper <script type="text/javascript"> tags. You must have accidentally stripped those out. Once you add in that it will work fine for you and yes it is automatic, you don't have to input your checkbox names.

    Best,

    Ben

  • bkhayes
    bkhayes Bloomington, MNPosts: 59 Silver Medal

    Hey,

    Notice on the HTML editor how the JavaScript is in white? That means that it isn't surrounded by the proper <script type="text/javascript"> tags. You must have accidentally stripped those out. Once you add in that it will work fine for you and yes it is automatic, you don't have to input your checkbox names.

    Best,

    Ben

    Whoops! I realized I stripped those out in my updated answer! Here is the proper snippet to copy over! Sorry for the confusion.

    <!-- jQuery 1.12.4 -->

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js "></script>

    <!-- Script That Makes A Set Amount Of Checkboxes Required On An Eloqua 10 Form -->

    <script type="text/javascript">

    $(document).ready(function() {

      $('input[type=submit]').click(function() {

        checked = $("input[type=checkbox]:checked").length;

        <!-- Change This To Your Desired Amount Of Required Checkboxes -->

        requiredChecked = 2;

        if (checked !== requiredChecked) {

          alert("You must check at least" + " " + requiredChecked + " " + "checkboxes.");

          return false;

        }

      });

    });

    </script>

  • 3341989
    3341989 Digital Consultant Posts: 6

    *UPDATED ANSWER*

    If you want to make it easier you can use this instead. Simply place before ending </body> tag in HTML and change requiredChecked to your desired amount. This code is set to two.

    <!-- jQuery 1.12.4 -->

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js "></script>

    <!-- Script That Makes A Set Amount Of Checkboxes Required On An Eloqua 10 Form -->

    $(document).ready(function() {

      $('input[type=submit]').click(function() {

        checked = $("input[type=checkbox]:checked").length;

        <!-- Change This To Your Desired Amount Of Required Checkboxes -->

        requiredChecked = 2;

        if (checked !== requiredChecked) {

          alert("You must check at least" + " " + requiredChecked + " " + "checkboxes.");

          return false;

        }

      });

    });

    Hi Ben

    IT WORKED. I kept testing. Thank you so much. But now I am facing another problem. It would be awesome if you could help me with this.

    Besides my 3 checkboxes, I have a single check box with our Privacy Policy which has to be required as well. This means I am now using both your codes (for a single checkbox and multiple checkboxes) in one form. Unfortunately, instead of the single checkbox, the first box in the multiple picklist is now required, please see below:

    The single checkbox is not required anymore. Before I added the multiple checkboxes it worked just fine.

    pastedImage_1.png

    The code I used for the single checkbox is the following. I used the forth field category so I placed nr 4 in the code.

    pastedImage_2.png

    Was that wrong?

    Thanks again so much.

  • bkhayes
    bkhayes Bloomington, MNPosts: 59 Silver Medal

    Hi Ben

    IT WORKED. I kept testing. Thank you so much. But now I am facing another problem. It would be awesome if you could help me with this.

    Besides my 3 checkboxes, I have a single check box with our Privacy Policy which has to be required as well. This means I am now using both your codes (for a single checkbox and multiple checkboxes) in one form. Unfortunately, instead of the single checkbox, the first box in the multiple picklist is now required, please see below:

    The single checkbox is not required anymore. Before I added the multiple checkboxes it worked just fine.

    pastedImage_1.png

    The code I used for the single checkbox is the following. I used the forth field category so I placed nr 4 in the code.

    pastedImage_2.png

    Was that wrong?

    Thanks again so much.

    So you are trying to have 2 checkboxes required? Or are you trying to have the privacy checkbox and any other checkbox required?

  • bkhayes
    bkhayes Bloomington, MNPosts: 59 Silver Medal

    So you are trying to have 2 checkboxes required? Or are you trying to have the privacy checkbox and any other checkbox required?

    What if you make them all single checkboxes. Does it work for you then?

  • 3341989
    3341989 Digital Consultant Posts: 6

    What if you make them all single checkboxes. Does it work for you then?

    Hi Ben

    Yes, I want to have the picklist 'Workshops' required, so that people have to select at least two options and additionally I want the Single Checkbox 'Privacy Setting' required. Having them all single is not working, as the participants can only select two workshops out of the three options.

    I want to keep both the workshop and privacy two separate custom fields that are both required.

    Is that possible? How could I do that?

  • 3341989
    3341989 Digital Consultant Posts: 6

    What if you make them all single checkboxes. Does it work for you then?

    The form in the form editor looks like this

    pastedImage_0.png

  • bkhayes
    bkhayes Bloomington, MNPosts: 59 Silver Medal

    The form in the form editor looks like this

    pastedImage_0.png

    Just for clarity here, you want the following, correct?

    • 2 out of the 3 group checkboxes must be required
    • Privacy Policy must also be required

    If that is the case:

    <!-- jQuery 1.12.4 -->

        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

        

        <!-- Script That Makes A Set Amount Of Checkboxes Required On An Eloqua 10 Form -->

        <script type="text/javascript">

        $(document).ready(function() {

          var dom1 = document.querySelector("input[name=singleCheckbox]");var field1 = new LiveValidation(dom1, {validMessage: "", onlyOnBlur: false, wait: 300}).add(Validate.Acceptance, {failureMessage:" "});

          $('input[type=submit]').click(function() {

            checked = $("input[name=checkboxes]:checked").length;

            requiredChecked = 2;

            if (checked !== requiredChecked && checked <= requiredChecked) {

              alert("You must check at least" + " " + requiredChecked + " " + "checkboxes and the terms & conditions box.");

              return false;

            }

          });

        });

        </script>

    Working Eloqua 10 example here:

    Multiple Required Checkbox Testing Page

  • Hi @mhalliday I am running into an issue with my form validation, I have form validation set up for a number of fields on my company's contact form, however in your example with your email address when you click on the field and then click off you get a this field is required message, with our form when I try this nothing happens. Is there any insight you can provide to why our form is not acting the same as your example?

    Thank you,

    Tony 

  • 3341989
    3341989 Digital Consultant Posts: 6

    Just for clarity here, you want the following, correct?

    • 2 out of the 3 group checkboxes must be required
    • Privacy Policy must also be required

    If that is the case:

    <!-- jQuery 1.12.4 -->

        <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

        

        <!-- Script That Makes A Set Amount Of Checkboxes Required On An Eloqua 10 Form -->

        <script type="text/javascript">

        $(document).ready(function() {

          var dom1 = document.querySelector("input[name=singleCheckbox]");var field1 = new LiveValidation(dom1, {validMessage: "", onlyOnBlur: false, wait: 300}).add(Validate.Acceptance, {failureMessage:" "});

          $('input[type=submit]').click(function() {

            checked = $("input[name=checkboxes]:checked").length;

            requiredChecked = 2;

            if (checked !== requiredChecked && checked <= requiredChecked) {

              alert("You must check at least" + " " + requiredChecked + " " + "checkboxes and the terms & conditions box.");

              return false;

            }

          });

        });

        </script>

    Working Eloqua 10 example here:

    Multiple Required Checkbox Testing Page

    Hi Ben

    It works perfectly, this is awesome. I can't thank you enough!!!!!!!!!!!!!

    Cheers

    Daniela

  • bkhayes
    bkhayes Bloomington, MNPosts: 59 Silver Medal

    Hi Ben

    It works perfectly, this is awesome. I can't thank you enough!!!!!!!!!!!!!

    Cheers

    Daniela

    All you have to do now is mark the answer as correct on your end   Glad it worked for you!

  • rlnagelmaker
    rlnagelmaker Alphen aan den Rijn, NetherlandsPosts: 9 Silver Medal

    @MateuszDąbrowski

    Check this out funny.

    kr,

    Robert