jQuery-Validierung mit Eingabe Maske

Haben das problem, dass die Formularfelder mit zugeordneten Maske (als Platzhalter) sind nicht validiert, so leer von jQuery Validierung.

Benutze ich:

Einige seltsame Verhaltensweisen:

  1. Eingänge mit Attribut required validiert werden (per jQuery) nicht leer und daher gültige, aber in der anderen hand-Eingang ist nicht als "nicht leer" und nicht geprüft für andere Validierungsregeln (dies ist validator.js)
  2. Wenn ich Schreibe etwas in das Eingabefeld und löschen Sie es, ich bekomme required Fehlermeldung

Kann mir jemand einige Tip???

BEARBEITEN:
Relevante code:

HTML/PHP:

<form enctype="multipart/form-data" method="post" id="feedback">
    <div class="kontakt-form-row form-group">
        <div class="kontakt-form">
            <label for="phone" class="element">
                phone<span class="required">*</span>
            </label>
        </div>
        <div class="kontakt-form">
            <div class="element">
                <input id="phone" name="phone" ' . (isset($user['phone']) ? 'value="' . $user['phone'] . '"' : '') . ' type="text" maxlength="20" class="form-control" required="required" data-remote="/validator.php">
            </div>
        </div>
        <div class="help-block with-errors"></div>
    </div>
</form>

JS:

$(document).ready(function() {

    $('#phone').inputmask("+48 999 999 999");

    $('#feedback').validator();      
});
InformationsquelleAutor D. Cichowski | 2015-09-15
  1. 2

    Es ist nicht gerade die Lösung, aber...

    ändern Eingabeformat für ein ähnliches löst das problem.

    Immer noch weit entfernt von perfekt, aber : (

    ERKLÄRUNG:

    Andere Maskierung Bibliotheken, nicht über diese seltsamen Verhaltensweisen erwähnt, so ist es möglich, Felder überprüfen.

    Ich verwendet:
    https://github.com/digitalBush/jquery.maskedinput

    • Ich bin froh, dass du posting über dieses Problem bin ich mit der exakt gleichen. Habe mit jquery.maskedinput dein problem gelöst? Ich bin mit jquery.maskedinput auch, aber ich bekomme immer noch die Fehlermeldung, die auf den Feldern als erforderlich markiert.
    • Es funktioniert für mich. Erste Fehlermeldung ist genau hier das Ziel.
    • Ich denke, wir haben möglicherweise eine andere version der Bibliotheken, da unabhängig von der Eintragung (richtig oder falsch), die Maske werfen immer ein Fehler.
    • Upps, ich habe mich verrechnet das max-Attribut und nicht Rücksicht auf die Striche Hinzugefügt, durch die Maske. Es funktioniert
    InformationsquelleAutor D. Cichowski
  2. 1

    Konnte ich verwenden, die RobinHerbots die Inputmask - (3.3.11) mit jQuery Validierung, durch die Aktivierung clearIncomplete. Sehen Eingabemaske Dokumentation gewidmet Abschnitt:

    Klar die unvollständige Eingabe auf blur

    $(document).ready(function(){
  $("#date").inputmask("99/99/9999",{ "clearIncomplete": true });
});

    Personnaly, wenn möglich, bevorzuge ich diese Einstellung durch HTML-Attribut data:

    data-inputmask-clearincomplete="true"

    Der Nachteil ist: teilweise Eingang gelöscht, wenn der Fokus verloren geht, aber kann ich mit Leben. Also vielleicht auch du ...

    Bearbeiten: wenn Sie brauchen, um hinzuzufügen, die Maske die Validierung der rest der jQuery Validierung Prozess, können Sie simulieren eine jQuery Validierung Fehler, indem Sie Folgendes tun:

    //Get jQuery Validate validator currently attached
var validator = $form.data('validator');

//Get inputs violating masks
var $maskedInputList 
    = $(':input[data-inputmask-mask]:not([data-inputmask-mask=""])');
var $incompleteMaskedInputList 
    = $maskedInputList.filter(function() { 
        return !$(this).inputmask("isComplete"); 
    });
if ($incompleteMaskedInputList.length > 0)
{
    var errors = {};
    $incompleteMaskedInputList.each(function () {
        var $input = $(this);
        var inputName = $input.prop('name');
        errors[inputName] 
            = localize('IncompleteMaskedInput_Message');
    });

    //Display each mask violation error as jQuery Validate error
    validator.showErrors(errors);

    //Cancel submit if any such error
    isAllInputmaskValid = false;
}

//jQuery Validate validation
var isAllInputValid = validator.form();

//Cancel submit if any of the two validation process fails
if (!isAllInputValid ||
    !isAllInputmaskValid) {
    return;
}

//Form submit
$form.submit();
    InformationsquelleAutor Antoine Robin
  3. 0

    Ich habe das gleiche Problem, wenn Sie kombiniert diese beiden libs zusammen.

    Tatsächlich gibt es ein ähnliches ticket hier: https://github.com/RobinHerbots/Inputmask/issues/1034

    Hier ist die Lösung von RobinHerbots:

    $("#inputPhone").inputmask("999.999.9999", {showMaskOnFocus: false, showMaskOnHover: false});

    Der validator davon aus, dass es nicht leer ist, wenn die Maske den Fokus/hover ist da.
    drehen Sie einfach den Fokus und bewegen Sie den Mauszeiger in die Maske, aus der das problem lösen wird.

    InformationsquelleAutor Terence
  4. 0

    Ich dieses problem gelöst mit:

    phone_number: {
            presence: {message: '^ Prosimy o podanie numeru telefonu'},
            format: {
                pattern: '(\\(?(\\+|00)?48\\)?)?[ -]?\\d{3}[ -]?\\d{3}[ -]?\\d{3}',
                message: function (value, attribute, validatorOptions, attributes, globalOptions) {
                    return validate.format("^ Nieprawidłowa wartość w polu Telefon");
                }
            },
            length: {
            minimum: 15,
                message: '^ Prosimy o podanie numeru telefonu'
            },
        },
    InformationsquelleAutor user3089561
Schreibe einen Kommentar