淘汰赛验证失败

Posted 2023-05-09

【中文标题】淘汰赛验证失败

【英文标题】：Knockout Validation Failing to Fire

【发布时间】：2017-01-27 09:33:22

【问题描述】：

我有一个带有字符串属性、一个 int 属性和两个其他模型列表的淘汰模型。在视图中，我试图验证剔除对象中的属性，此时只需确保它们存在。

我正在使用 Knockout.Validation 库，使用扩展。

我遇到的问题是，当我单击按钮发送验证请求时，出现 javascript 错误 self.isValid is not a function

我在网上查了一下，似乎其他人也有问题，只是他们的解决方案对我不起作用。

Javascript 模型

EditTestStep

var StringParameterViewModel = function(data) 
    var self = this;

    if (data != null) 
        ko.mapping.fromJS(data, stringParameterMapping, self);
     else 
        self.ParameterName = ko.observable().extend(
            required: message: 'Please enter a parameter name.'
        );
        self.StringValue = ko.observable().extend(
            required:  message: 'A value for the parameter is needed.' 
        );

    


var XmlParameterViewModel = function (data) 
    var self = this;

    if (data != null) 

        ko.mapping.fromJS(data, xmlParameterMapping, self);
     else 
        self.ParameterName = ko.observable().extend(
            required: true
        );
        self.XmlValue = ko.observable().extend(
            required: true
        );
    


var xmlParameterMapping = 
    craete: function(options) 
        return XmlParameterViewModel(options.data);
    



var stringParameterMapping = 
    create: function(options) 
        return StringParameterViewModel(options.data);
    


var editTestStepMapping = 
    create: function(options) 
        return EditTestStepViewModel(options.data);
    


var EditTestStepViewModel = function(data) 
    var self = this;
    if (data != null) 
        ko.mapping.fromJS(data, , self);

     else 
        self.StringParameters = ko.observableArray();
        self.XmlParameters = ko.observableArray();
        self.TestStepName = ko.observable().extend(
            required: true
        );
    

    self.saveTestStep = function() 
        var dataToSend = ko.mapping.toJSON(self);
        $.ajax(
            url: "/Home/SaveEdit/",
            type: "POST",
            contentType: "application/json",
            data: dataToSend
        );
    ;

    self.Errors = ko.validation.group(self);

    self.checkValid = function () 
        if (self.isValid()) 
            alert('All ok!');
         else 
            self.Errors.showAllMessages();
        
    





var validationOptions = 
    insertMessages: true,
    decorateElement: true,
    errorElementClass: 'errorCSS',
    messagesOnModified: true,
    debug: true,
    grouping: 
        deep: true,
        observable: false //Needed so added objects AFTER the initial setup get included
    
;

ko.validation.init(validationOptions, true);

查看

@using System.Web.Script.Serialization
@model MvcNewPatternsDemo.Models.EditTestStepViewModel


@ string data = new JavaScriptSerializer().Serialize(Model);

@
    ViewBag.Title = "Home Page";

@section scripts


    <script src="~/Scripts/knockout-3.4.0.js"></script>
    <script src="~/Scripts/knockout.validation.js"></script>
    <script src="~/Scripts/knockout.mapping-latest.js"></script>
    <script src="~/Scripts/jquery-1.10.2.js"></script>
    <script src="~/Scripts/EditTestStep.js"></script>
    <script type="text/javascript">
        var editTestStepViewModel = new EditTestStepViewModel(@html.Raw(data));
        ko.applyBindingsWithValidation(editTestStepViewModel);
    </script>
    

<form>

    <input class="form-control" name="ParameterName" data-bind="value: TestStepName"/>
    <input class="form-control" name="TestStepId" data-bind="value: TestStepId"/>

    <table class="table table-striped">
        <tr>
            <th>StringParameters</th>
        </tr>

        <tbody data-bind="foreach: StringParameters">
        <tr>
            <td class="form-group"> <input name="ParameterName" class="form-control input-sm" data-bind="value: ParameterName"/></td>
            <td class="form-group"> <input name="StringValue" class="form-control input-sm" data-bind="value: StringValue"/></td>
        </tr>
        </tbody>

    </table>

    <table class="table table-striped">
        <tr>
            <th>XmlPara</th>
        </tr>

        <tbody data-bind="foreach: XmlParameters">
            <tr>
                <td class="form-group"> <input name="ParameterName" class="form-control input-sm" data-bind="value: ParameterName" /></td>
                <td class="form-group"> <input name="XmlValue" class="form-control input-sm" data-bind="value: XmlValue" /></td>
            </tr>
        </tbody>

    </table>


</form>




<div class="row">
    <button data-bind="click: saveTestStep" type="submit">Save Test Step</button>
    <button data-bind="click: checkValid"type="button">Check Valid</button>
</div>

模型

namespace MvcNewPatternsDemo.Models




    public class TestStepDisplayModel
    
        public int TestStepId  get; set; 
        public string TestStepName  get; set; 

    

    public class StringParameterViewModel
    
        public string ParameterName  get; set; 
        public string StringValue  get; set; 
    

    public class XmlParameterViewModel
    
        public string ParameterName  get; set; 
        public string XmlValue  get; set; 
    


    [Serializable]
    public class EditTestStepViewModel
    
        public string TestStepName  get; set; 
        public int TestStepId  get; set; 
        public List<StringParameterViewModel> StringParameters  get; set; 
        public List<XmlParameterViewModel> XmlParameters  get; set; 

        public EditTestStepViewModel()
        
            this.StringParameters = new List<StringParameterViewModel>();
            this.XmlParameters = new List<XmlParameterViewModel>();
        

    

对控制器的 ajax 调用有效，并且正在发送来自对象的所有数据，我只需要验证即可运行。

【问题讨论】：

你调试你的代码看你的ko.observable().extend();曾经被处决过吗？

【参考方案1】：

我没有在您的 javascript 中看到您注册扩展程序的行。

尝试在末尾添加：

ko.validation.registerExtenders();