Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/88.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 是否在加载时隐藏验证消息?击倒_Javascript_Jquery_Knockout.js - Fatal编程技术网

Javascript 是否在加载时隐藏验证消息?击倒

Javascript 是否在加载时隐藏验证消息?击倒,javascript,jquery,knockout.js,Javascript,Jquery,Knockout.js,我一直试图在加载时隐藏错误消息,并希望它们在保存时显示。我在很多情况下都成功了,我能够相应地调整我的代码,但这似乎是一个持续的错误,我无法摆脱它 我的功能: function work() { var self=this; self.Time= ko.observable(""); self.Validation = ko.validatedObservable([ self.Time.extend(

我一直试图在加载时隐藏错误消息,并希望它们在保存时显示。我在很多情况下都成功了,我能够相应地调整我的代码,但这似乎是一个持续的错误,我无法摆脱它

我的功能

        function work() {
        var self=this;
        self.Time= ko.observable("");
        self.Validation = ko.validatedObservable([
                self.Time.extend({required:true}) ] );

        self.calculate=ko.computed(function(){
        return self.Time() * 2 ;
        });
  }
我在这行添加了一块手表
self.mainArray.Validation.errors().length

根据我的观察,我清楚地调试了
watch
值的递增位置

因此,我尝试了许多方法来控制错误消息onLoad的显示,但没有像extend中的
init
onlyif
那样的效果

init
我尝试保留
showmessages:false
的工作方式只有一种,但单击“保存”按钮后,我无法进一步显示消息

model.messages(false)
不执行任何操作

工作解决方案:性能将受到影响

ko.utils.arrayForEach(self.mainArray(), function (service) {
        if (service.Validation.errors().length > 0) {
            service.Validation.errors.showAllMessages(false);
        }

    });
像这样,我有许多循环内部循环结构,我不能做同样的事情,我只是需要一些很酷的东西,这样我可以隐藏消息加载


我提供了我的观察结果,任何建议在这里都非常方便,如果我能帮助你提供更多信息,请让我知道

这将只计算提交时的验证,并包括显示错误消息-

Html-

<div class="container no-padding">
    <div class="col-md-12 col-sm-12 col-xs-12">
        <div class="col-md-4 col-sm-4 col-xs-12">
            <div>
                <div>
                    <p>Phone: <a href="tel:0123456789">0123456789</a></p>
                    <p>Email: <a href="mailto:a@b.com" target="_top">email@example.co.uk</a></p>
                    <pre data-bind="text: ko.toJSON($data, null, 2)"></pre>
                </div>
            </div>
        </div>

        <div class="col-md-8 col-sm-8 col-xs-12">
            <div>
                <div>
                    <form role="form">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group" data-bind="validationElement: firstName">
                                    <label class="control-label" for="contact-name">First Name</label>
                                    <input type="text" class="form-control" id="contact-name" placeholder="i.e Joe" data-bind="textInput: firstName"/>
                      <span class="help-block" data-bind="validationMessage: firstName"></span>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group" data-bind="validationElement: email">
                                    <label class="control-label" for="contact-email">Email</label>
                                    <input type="email" class="form-control" id="contact-email" placeholder="i.e email@info.com" data-bind="textInput: email"/>
                      <span class="help-block" data-bind="validationMessage: email"></span>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="form-group" data-bind="validationElement: surname">
                                    <label class="control-label" for="contact-surname"> Surname</label>
                                    <input type="text" class="form-control" id="contact-surname" placeholder="i.e Bloggs" data-bind="textInput: surname"/>
                      <span class="help-block" data-bind="validationMessage: surname"></span>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="form-group" data-bind="validationElement: category">
                                    <label class="control-label" for="contact-topic">Please select a category</label>
                                    <select class="form-control" id="contact-topic" data-bind="value: category">
                                        <option value="">Select category</option>
                                        <option value="general">General contact</option>
                                        <option value="issue">Report an issue</option>
                                        <option value="help">Help enquiry</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group" data-bind="validationElement: message">
                                <label class="control-label" for="contact-textarea">Write your message here, the more detail the better</label>
                              <textarea style="width:100%" id="contact-textarea" placeholder="Place message here" rows="10" data-bind="textInput:message"></textarea>
                   <span class="help-block" data-bind="validationMessage: message"></span>
                            </div>
                            <button type="button" class="btn btn-green" data-bind="click: submit">Get in touch</button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
var mynamespace = mynamespace || {};

ko.validation.init({
  errorElementClass: 'has-error',
  errorMessageClass: 'help-block',
  decorateElement: true,
  insertMessages: false
});

//Viewmodel
mynamespace.ContactUsViewModel = function(){
  var self = this;
  self.validationEnabled = ko.observable(false);
  self.isValidationEnabled = function() {
    return self.validationEnabled();
  }
  self.firstName = ko.observable('').extend({
    required: {
      onlyIf: self.isValidationEnabled
    },
    minLength: {
      onlyIf: self.isValidationEnabled,
      params: 5
    } 
  });
  self.email = ko.observable('').extend({
    required: {
      onlyIf: self.isValidationEnabled
    },
    email: {
      onlyIf: self.isValidationEnabled
    }
  });
  self.surname = ko.observable('').extend({
    required: {
      onlyIf: self.isValidationEnabled
    },
    minLength: {
      onlyIf: self.isValidationEnabled,
      params: 5
    } 
  });
  self.category = ko.observable('').extend({
    required: {
      onlyIf: self.isValidationEnabled
    },
    minLength: {
      onlyIf: self.isValidationEnabled,
      params: 1
    } 
  });
  self.message = ko.observable('').extend({
    required: {
      onlyIf: self.isValidationEnabled
    },
    minLength: {
      onlyIf: self.isValidationEnabled,
      params: 5
    } 
  });
  self.submit = function() {
    self.validationEnabled(true);
    if (!this.isValid()) {
      this.errors.showAllMessages();
    } else {
      alert('Form Valid');
    };
  }
};

var viewmodel = ko.validatedObservable(new mynamespace.ContactUsViewModel())();
ko.applyBindings(viewmodel);