kendoUI 网格弹出编辑模板验证不选择模型验证规则 [英] kendoUI grid popup edit template validation not picking up model validation rules

问题描述

当您在未使用模板的网格中单击编辑时，您为 schema.Model 定义的验证规则将得到正确应用.但是，如果您使用自定义模板，则不会应用 schema.Model 验证规则.

When you click edit in a grid that is not using a template then the validation rules that you defined for the schema.Model get applied correctly. But if you use a custom template the schema.Model validation rules do not get applied.

我怀疑答案是因为我使用的是自定义弹出编辑模板以便我可以有一个下拉列表，所以我必须手动指定每个 html 输入字段的规则，例如 required.我希望这不是真的，并且定义 schema.Model 的相同规则也适用于编辑器模板.

I suspect that the answer is that because I am using a custom popup edit template so that I can have a dropdown list, that I have to manually specify the rules for each html input field such as required. I so hope this is not true and that the same rules for defined the schema.Model will also work for an editor template.

知道答案的请留言，谢谢！丹

Please post if you know the answer, Thanks! Dan

@丹尼尔这是我获取模型中定义的验证属性并将它们添加到 DOM 的代码

@Daniel Here is my code for getting the validation attributes defined in the model and adding them to the DOM

/**
 * Sets label,input html5 attributes and css based on the validation attributes of the
 * model for the given dataSource
 * @param {Object} myDs    dataSource that contains the Model Schema used for validation.
 */
function addValidationAttributes(myDs) {

    var myFields
    //Pass in DS or pass in model from grid
    if (myDs.options) {
        myFields = myDS.options.schema.model.fields
    } else//model
    {
        myFields = myDs.fields
    }

    $.each(myFields, function(fieldName) {
        //Add validation attributes
        if (this.validation) {
            $('#' + fieldName).attr(this.validation);
            //Set label to required if field is required
            if (this.validation.required) {
                $('label[for=' + fieldName + ']').addClass('required');
                $('#' + fieldName).attr('title', "required");
                //Check if KendoUI widget because it creates an extra span
                if ($('#' + fieldName).is('[data-role]')) {
                    $('.k-widget').after('<span class="k-invalid-msg" data-for="' + fieldName + '"></span>');
                } else {
                    $('#' + fieldName).after('<span class="k-invalid-msg" data-for="' + fieldName + '"></span>');
                }
            }
        } else//optional
        {
            //Non requried fields set to optional exclude KEY ID STAMP
            if (fieldName !== '__KEY' && fieldName !== '__STAMP' && fieldName !== 'ID') {
                //Check if KendoUI widget because it creates an extra span
                if ($('#' + fieldName).is('[data-role]')) {
                    $('.k-widget').after('<span class="optional" data-for="' + fieldName + '"></span>');
                } else {
                    $('#' + fieldName).after('<span class="optional" data-for="' + fieldName + '"></span>');
                }
            }
        }

    });
}

另外，为了以防万一，我设置了一个类，在必填字段的标签前添加一个 *，在每个不需要字段后添加文本可选"的类.KEY、ID 和 STAMP 是在我的模型中定义的字段，但我没有将它们放在表单中，因此您可以根据需要排除或不排除实体键字段.

Also just in case you want it I set a class which adds an * before the label of a required field and a class the adds text "Optional" after each no required field. The KEY, ID, and STAMP are fields defined in my model but I don't put them on a form, so you can exclude your entity key field or not if you want.

他们来了

.required:before {
    content: "*";
    color: red
}

.optional:after {
    content: " (optional)";
    color: #777;
}

推荐答案

在输入元素中使用required

<input type="text" class="k-input k-textbox" name="Name" data-bind="value:Name" required>

这篇关于kendoUI 网格弹出编辑模板验证不选择模型验证规则的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！