2017-02-21 4 views
0

Ich möchte das Jahr mit KnockoutJS-Bibliothek validieren. Das Problem, mit dem ich konfrontiert bin, ist, dass es keine Validierung für das Jahr gibt, wenn der Benutzer ein falsches Jahr eingibt. Nachfolgend sind die Fälle eines falschen Jahres aufgeführt.validate ein Datum (Jahr) mit Knockout JS

(01/01/12 becomes 01/01/0012) 
(01/01/01 becomes 01/01/0001) 
(01/01/111 becomes 01/01/0111) 
(01/01/00 becomes 01/01/0000) 

Wie kann ich das Jahr validieren, wenn es falsch ist? Ich verwende Knockout JS.

Vielen Dank im Voraus Jungs !!

+0

Klingt wie Sie Validierung benötigen.: https://github.com/Knockout-Contrib/Knockout-Validation – 4imble

+0

Danke @ 4imble !! Ich werde den Link überprüfen. – ayoub

Antwort

1

Sounds wie Parsing Datum Werte ist das Problem. Verwenden Knockout mit Moment.js hat sich für mich in der Vergangenheit zusammengearbeitet:

0

ähnlich der Antwort oben Referenzierung Knockout und Moment js. hier ist ein Ich habe (ich keine Verlängerung, sondern nur eine berechnete und die CSS verwendet haben Bindungs ​​Fehler an die Bootstrap-Form Gruppe hinzuzufügen hat

function model() { 
 
    var self = this; 
 
    this.myDate = ko.observable(''); 
 
    this.myDateisValid = ko.computed(function() { 
 
    return moment(this.myDate(), "MM/DD/YYYY", true).isValid(); 
 
    }, this); 
 
} 
 

 
var myViewModel = new model(); 
 

 
$(document).ready(function() { 
 
    ko.applyBindings(myViewModel); 
 
});
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.5.1/moment.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="form-group" data-bind="css: {'has-error': !myDateisValid() }"> 
 
    <label for="date">Date:</label> 
 
    <input type="text" class="form-control" id="date" placeholder="MM/DD/YYYY" data-bind="textInput: myDate"> 
 
</div> 
 

 
Date is Valid: <label data-bind="text: myDateisValid"></label>