it-swarm.com.de

jQuery validate plugin auf DIV

Ich versuche, das validate plugin für ein div zu verwenden, wie in der Antwort auf diese Frage gezeigt :

<script type="text/javascript">
  $("#pseudoForm").validate({
    onfocusout:true,
    rules:{
      first_name:"required",
      last_name:"required"
    }
  });
</script>
<!-- whatever -->
<div id="pseudoForm">
  <input type="text" name="first_name"/>
  <input type="text" name="last_name"/>
</div>

Ich habe alles in einem Formular. 

Ich bekomme eine Reihe verschiedener Fehler in verschiedenen Browsern.

  • Firefox: Validator in undefined 
  • IE8: 'settings' ist null oder kein Objekt
  • Chrome: Eigenschaftseinstellungen von undefined können nicht gelesen werden

Jede Hilfe geschätzt!

30
JohnIdol

Dies ist nicht die Antwort, die Sie hören möchten, aber die andere Antwort ist falsch (es war möglicherweise richtig als es gepostet wurde, aber seitdem wurden mehrere wichtige Änderungen an jQuery-Validierungs-Plug-Ins vorgenommen. 

Das Validierungs-Plugin ist (derzeit) für die Arbeit mit einem <form> und nur für einen <form> konzipiert. Sie können auch beachten, dass die gesamte Plugin-Dokumentation auf ein Formular verweist, nicht auf andere generische Container.

Das Plugin selbst verfolgt validator.currentForm intern, was sich auf die this des übergebenen Selektors bezieht, wobei .elements usw. abgelesen wird ... es wird wirklich nicht anders funktionieren und nicht so, wie die aktuelle Version geschrieben wurde .

Der Gesamtlösungsansatz/alternative Ansatz hier: call .validate() auf dem <form>-Element (eher der jQuery-Wrapper), nicht irgendein anderer Container. Wenn Sie Ihre <form>-Elemente aufteilen müssen, verwenden Sie <fieldset> - Elemente. Verwenden Sie möglicherweise die ignore: ':hidden'-Option in .validate(), wenn Sie keine Eingabefelder überprüfen möchten, die für den Benutzer nicht sichtbar sind.

52
Nick Craver

Öffnen Sie jquery.validate.js oder jquery.validate.min.js und suchen Sie (Strg + F) " label " und replaceAll mit Ihrem gewünschten Tag: 

Beispiel: div

führen Sie dann die Validierung durch.

0

Ihnen fehlt eine schließende Klammer. Versuchen Sie es stattdessen:

$("#pseudoForm").validate({
    onfocusout:true,
    rules:{
        first_name:"required",
        last_name:"required"
    }
});
0
treeface
//HTML

<div class="form-group has-feedback col-xs-8 " style="padding-right:0px">
                <input type="tel" class="form-control" name="Otp_MobileNo" id="mobileNo" placeholder="Mobile No."  minlength="10" maxlength="10">
                <span id="mobileno_message"  style="display:none;color: red;">Please enter a valid Mobile No</span>
            </div>


    //Java Script
     $("#getOtp").click(function(){
         jQuery(document).ready(function(){





            var MobileNo = jQuery("#mobileNo").val();
            var MobileNoLength = MobileNo.length;  
            var zipRegex = /^\d{10}$/;
             var mobileNo = $("#mobileNo").val();

            if (!zipRegex.test(MobileNo))
            { 
               jQuery('#mobileno_message').show();


            }
            else
            { 

              // success!

                 jQuery('#mobileno_message').hide();
                 $.ajax({
                type : 'POST',
                url  : '<?php echo site_url('Login/send_otp'); ?>',
                data : {Otp_MobileNo:mobileNo,},
                dataType    : 'json',
                beforeSend: function()
                { 
                  $("#error").fadeOut();
                },
                success :  function(response)
                { 
                alert(response.message_text);
                $("#check-otp").delay().animate({
                    height: 'toggle',
                  },
                  "slow");
                $("#getOtp").hide();
                }
             });





            }

          });



           });
0
Inam Habib

Sie können den gleichen Fehler erhalten, wenn Sie das Formular nach Klasse auswählen

$(".form_class").validate(...

statt nach ID $("#form_id").validate(...

oder Tag Name $("form").validate(...

0
tomas.satinsky