javascriptjqueryjquery-validation-engine

How to perform a minCheckBox validation on jQuery Validate Engine?


In a form with three checkboxes I need to validate at least one of them has been checked. The company I work for is using jQuery Validation Engine. I am testing with the latest version/release.

As per library requirements my code should looks like:

<input type="checkbox" name="agreement" value="1" id="agreement_0" class="validate[minCheckbox[1]] checkbox">
<input type="checkbox" name="agreement" value="1" id="agreement_1" class="validate[minCheckbox[1]] checkbox">
<input type="checkbox" name="agreement" value="1" id="agreement_2" class="validate[minCheckbox[1]] checkbox">

If I go that way indeed the validation does work and at least one of them is required however my $_POST only contains the last of them, I guess is because they are sharing the same name (which I think is incorrect). Here are the docs for minCheckbox.

If I use instead the following approach (which is the correct as per my knowledge) then I end up with Javascript errors:

<input type="checkbox" name="agreement[]" value="1" id="agreement_0" class="validate[minCheckbox[1]] checkbox">
<input type="checkbox" name="agreement[]" value="1" id="agreement_1" class="validate[minCheckbox[1]] checkbox">
<input type="checkbox" name="agreement[]" value="1" id="agreement_2" class="validate[minCheckbox[1]] checkbox">

Uncaught Error: Syntax error, unrecognized expression: input[name=agreement[]]

Bottom line:

Am I missing something here? How would you do this validation using jQuery Validation Engine?

Note: I can provide more details if needed and I can't change the library at this point in time.


Solution

  • Looks good to me, am i missing something?

    $('form').validationEngine();
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jQuery-Validation-Engine/2.6.4/jquery-1.8.2.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jQuery-Validation-Engine/2.6.4/jquery.validationEngine.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jQuery-Validation-Engine/2.6.4/languages/jquery.validationEngine-en.js"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jQuery-Validation-Engine/2.6.4/validationEngine.jquery.css"/>
    
    My Form
    <form>
      <input type="checkbox" name="agreement[]" value="1" id="agreement_0" class="validate[minCheckbox[1]] checkbox">A
      <input type="checkbox" name="agreement[]" value="1" id="agreement_1" class="validate[minCheckbox[1]] checkbox">B
      <input type="checkbox" name="agreement[]" value="1" id="agreement_2" class="validate[minCheckbox[1]] checkbox">C
    </form>