Jquery-validate-Nachricht zeigt das im text input in jquery mobile

Ich bin ziemlich neu bei jQuery mobile, ich verwende jQuery-Validate plugin für Formulare, Validierung Steuern, alles funktioniert Prima, aber die Validierung wird die Meldung zusammen mit den input-text-Feld. Hier ist das Bild:

Jquery-validate-Nachricht zeigt das im text input in jquery mobile

Jquery

 $(document).live('pageinit', function (e) {
     $('#form1').validate({             
         submitHandler: function (form) {
             $.mobile.changePage('#success', { transition: "slide" });
             return false; 
         }
     });
 });

HTML

    <div data-role="fieldcontainer">
        <label for="fname" data-theme="d">First Name:</label>
        <input type="text" id="fname" name="fname" data-theme="d" placeholder="Enter First Name" required>
        <br />
    </div>           
    <div data-role="fieldcontainer">
        <label for="lname" data-theme="d">Last Name:</label>
        <input type="text" id="lname" name="lname" data-theme="d" placeholder="Enter Last Name" required>
    </div>
    <div data-role="fieldcontainer">
        <label for="email" data-theme="d">E-mail Address:</label>
        <input type="email" id="email" name="email" data-theme="d" placeholder="Enter Email" required>
    </div>

InformationsquelleAutor Able Alias | 2013-11-05

  1. 8

    DEMO

    jQuery.validator.setDefaults({
    errorPlacement: function(error, element) {
        error.appendTo(element.parent().prev());
    }
});

    CSS

    .error{
    color:red;
    display:block; //to show error message in new line
}

    Aktualisiert Nach OP Kommentar

    Updated DEMO

    errorPlacement: function (error, element) {
        error.appendTo(element.parent().parent().after());
},

    anderen Weg DEMO

    Referenz

    http://jqueryvalidation.org/validate/

    Ich habe den code " errorPlacement: function (error, element) { error.appendTo(element.prev()); }," bevor submitHandler-Funktion, die nun seine nicht mit den Meldungen
    kann u machen ein Turnschuh ?? jsfiddle.net
    hier ist die Geige, jsfiddle.net/QAePU
    Danke, ich verpasste den Eltern, richtig? durch die Art und Weise, wie Sie die Botschaft unter der textbox?
    ja,der after() arbeitete für mich, Dank Thushar, eine große Hilfe.

    InformationsquelleAutor Tushar Gupta - curioustushar

  2. 0

    Empfehle ich den folgenden code für JQM 1.4:

    error.appendTo(element.closest('.ui-field-contain'));

    InformationsquelleAutor boustanihani

Schreibe einen Kommentar