Jquery Validierung für Checkbox mit Index

Question

Wie bekomme ich nur eine benutzerdefinierte jquery Validierung Nachricht und das in einem <div> über Element, wenn Checkbox-Name Array mit Index ist.

<div class="error">Error will show here</div> 
<input type="checkbox" value="0" name="is_appraisal[0]" class="is_appraisal_f siblingcheckbox" id="is_appraisal_f"> 

<input type="checkbox" value="0" name="is_appraisal[1]" class="is_appraisal_s siblingcheckbox" id="is_appraisal_s"> 

habe ich versucht, diese aber es funktioniert nicht

$.validator.addMethod("onechecked", function (value, elem, param) { 
      if ($(".siblingcheckbox:checkbox:checked").length > 0) { 
       return true; 
      } else { 
       return false; 
      } 
     }, "Please select any one of the following!"); 

     $.validator.addClassRules("siblingcheckbox", { 
      onechecked: true 
    }); 

Validierung funktioniert, aber dies gibt Fehlermeldung unten sowohl checkbox.Any Hilfe?

Answer 1

Jquery Validierung Bibliothek erzeugt ein Etikett für jede ungültige HTML-Element wie:

<label id="email_id-error" class="error" for="email_id">Please enter your Email.</label> 

Kopieren Sie einfach dieses Label aus html dom und entfernen Sie die Fehlermeldung und es auf Platz, in dem Sie die Fehlermeldung möchten. Jetzt ist die Platzierung der Fehlermeldung, wo dieses Label ist.

Answer 2

Wenn Sie möchten, dass alle Fehlermeldungen von jQuery Validate an einer Stelle angezeigt werden, die Sie verwenden würden. http://docs.jquery.com/Plugins/Validation/validate#toptions Suchen Sie errorPlacement Option auf dieser Seite.

1) , wenn Sie benutzerdefinierte Platzierung für alle Ihre Fehler möchten, können Sie dies tun:

$("#myform").validate({ 
    errorPlacement: function(error, element) { 
    error.appendTo('#errordiv'); 
    } 
}); 

2) Wenn Sie bestimmte Orte für einen oder mehrere Fehler Etiketten angeben möchten, können Sie dies tun.

errorPlacement: function(error, element) { 
    if (element.attr("name") == "email") 
     error.insertAfter(".some-class"); 
    else if (element.attr("name") == "phone") 
     error.insertAfter(".some-other-class"); 
    else 
     error.insertAfter(element); 
} 

bearbeiten

Dieser Balg Code in Ihrer Validierungsfunktion hinzufügen

$("#YOURFORMID").validate({ 
      errorPlacement: function(error, element) { 
       error.appendTo('.error'); 
      }, 
      success: function(label,element) { 
       $('.error').html(''); 
      } 

}); 

HINWEIS :: Namen Checkbox unterscheidet (is_appraisal [0], is_appraisal [1]), so Meldung angezeigt zwei Mal.

Überprüfen Sie auch unten Schnipsel Arbeits Demo für Gruppe von Kontrollkästchen Validierung mit benutzerdefinierten Nachricht an benutzerdefinierten Ort gesetzt

$(document).ready(function(){ 
      $("#myform").validate({ 
        rules: { 
        "is_appraisal[]": "required", 

      }, 
      messages: { 
       "is_appraisal[]": "Please select any one of the following!", 
       }, 
       errorPlacement: function(error, element) { 
       error.appendTo('.error'); 
       } 
      }); 
    }); 

.error 
{ 
    color:red; 
    } 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.0/jquery.validate.min.js"></script> 
<div class="error"></div> 
<form name="myform" id="myform" action="" method="post"> 
     <input type="checkbox" value="0" name="is_appraisal[]" class="is_appraisal_f siblingcheckbox" id="is_appraisal_f"> 
     <input type="checkbox" value="0" name="is_appraisal[]" class="is_appraisal_s siblingcheckbox" id="is_appraisal_s"> 
     <input type="submit" > 
    </form> 

Demo Link https://jsfiddle.net/9q0jwxo6/1/