Проверка поля ввода при отправке

#knockout-validation

#проверка нокаута

Вопрос:

Я пытаюсь проверить это поле ввода, когда нажимаю на кнопку отправки. Что происходит, когда я нажимаю на кнопку отправки, а текстовое поле пустое, оно предупреждает спасибо, однако оно должно предупреждать, пожалуйста, проверьте вашу отправку

HTML

 <div id="newTest">
    <fieldset>
        <div class="row">
            <label>Last name:</label>
            <input type="text" data-bind="value: lastName" />
        </div>

    </fieldset>

    <fieldset>
        <button type="button" data-bind='click: submit'>Submit</button>

    </fieldset>
</div>
  

Javascript

 <script src="~/Scripts/knockout-3.5.0.js"></script>
<script src="~/Scripts/knockout.validation.min.js"></script>
<script>

    var viewModel = function () {

        ko.validation.rules.pattern.message = 'Invalid.';

        ko.validation.init({
            registerExtenders: true,
            messagesOnModified: true,
            insertMessages: true,
            parseInputAttributes: true,
            messageTemplate: null
        }, true);

        var self = this;
        self.lastName = ko.observable().extend({ required: true }),

            self.submit = function () {
                if (viewModel.errors().length === 0) {
                    alert('Thank you.');
                }
                else {
                    alert('Please check your submission.');
                    viewModel.errors.showAllMessages();
                }
            };

    };

    viewModel.errors = ko.validation.group(viewModel);
    var viewModel2 = new viewModel();

    ko.applyBindings(viewModel2, document.getElementById("newTest"));

</script>
  

Ответ №1:

Поскольку вы инициализируете viewModel2 как new viewModel() , эти две строки кода:

 viewModel.errors = ko.validation.group(viewModel);
var viewModel2 = new viewModel();
  

должно быть:

 var viewModel2 = new viewModel();
viewModel.errors = ko.validation.group(viewModel2);
  

Мне также непонятно, почему вы написали это так, как вы это сделали. Это могло бы быть проще, IMO. Вот пример (JSFiddle:https://jsfiddle.net/vwuazfg0 /):

 ko.validation.rules.pattern.message = 'Invalid.';

ko.validation.init({
  registerExtenders: true,
  messagesOnModified: true,
  insertMessages: true,
  parseInputAttributes: true,
  messageTemplate: null
}, true);

var viewModel = {
    lastName : ko.observable().extend({ required: true }),
  submit : function () {
    if (viewModel.errors().length === 0) {
      alert('Thank you.');
    }
    else {
      alert('Please check your submission.');
      viewModel.errors.showAllMessages();
    }
  }
};

viewModel.errors = ko.validation.group(viewModel);

ko.applyBindings(viewModel, document.getElementById("newTest"));