根据预定义配置在HTML元素上设置动态验证条件

我收到了一个带有几个输入标签的员工html表单。问题是一些输入标签有基于当前用户登录到系统的动态验证标准。例如：用户1：将ssn视为带有14个字符的必填字段用户2：将ssn视为具有10个字符的必填字段。根据预定义配置在HTML元素上设置动态验证条件

我从数据库中获取条件。我成功实现required这样的：

var screenConfig = @Html.Raw(new JavaScriptSerializer().Serialize(ViewBag.ScreenConfig)); 
    $(document).ready(function() { 
    _.each(screenConfig, function(value, key) { 
      if (value.IsRequired == true) { 
       $("#"+value.ElementId).attr("required", "required"); 
       $("#"+value.ElementId).addClass("required-input"); 
      } 


    });});

但我被困文本输入长度，我想不出比从服务器发送脚本来分别处理每个元素以外的东西。它能以其他方式有效地完成吗？

来源

2017-03-27 Abdo Hussein

我认为你正在寻找的HTML输入属性['maxlength'（https://www.w3schools.com/html/html_form_attributes.asp）？ – Gareth

@Gareth'maxLength'会限制最大值，OK，但我需要的是强制一个特定的长度。 –

基于@Avitus建议：这就是我做了基于预定义的配置，使HTML元素动态验证： 1.我在DB ScreenElement创建了两个表，ScreenSettings：

CREATE TABLE [HR].[ScreenElement](
    [Id] [int] IDENTITY(1,1) NOT NULL, 
    [ElementId] [nvarchar](50) NULL, 
    [ElementName] [nvarchar](50) NULL, 
    [ScreenId] [int] NULL, 
    [IsRequired] [bit] NULL, 
    [MinLength] [int] NULL, 
    [MaxLength] [int] NULL, 
    CONSTRAINT [PK_ScreenElement] PRIMARY KEY CLUSTERED (
    [Id] ASC 
    )WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY] 
) ON [PRIMARY] 

GO 

CREATE TABLE [HR].[ScreenSettings](
    [Id] [int] IDENTITY(1,1) NOT NULL, 
    [NameA] [nvarchar](50) NULL, 
    [NameL] [varchar](50) NULL, 
    [ScreenKey] [varchar](150) NULL, 
CONSTRAINT [PK_ScreenSettings] PRIMARY KEY CLUSTERED 
(
    [Id] ASC 
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY] 
) ON [PRIMARY] 

GO

2.I通过屏幕关键字获取配置ControllerName.ActionName并在屏幕加载时将其传递到ViewBag中，然后将其序列化为js对象。 3.文档准备就绪。我用data-x属性和一些样式类标记元素。

var screenConfig = @Html.Raw(new JavaScriptSerializer().Serialize(ViewBag.ScreenConfig)); 


$(document).ready(function() { 
    _.each(screenConfig, function(value, key) { 
      if (value.IsRequired == true) { 
       $("#"+value.ElementId).attr("required", "required"); 
       $("#"+value.ElementId).addClass("required-input"); 
      } 
      if (value.MinLength !== 0 && value.MaxLength !== 0&&value.MaxLength>=value.MinLength) { 
       $("#"+value.ElementId).attr("data-min", value.MinLength.toString()); 
       $("#"+value.ElementId).attr("data-max", value.MaxLength.toString()); 
       if (value.MinLength === value.MaxLength) { 
        $("#"+value.ElementId).attr("data-length", value.MinLength.toString()); 
       } 

      } 


    });});

就是这样。

来源

2017-04-02 14:55:32

我会做的是添加额外的属性到输入标签指定的长度。然后在表单提交中为具有附加属性的输入执行.each。然后在那。每个验证长度。

来源

2017-03-27 12:34:52 Avitus

你能详细说明一下演示还是编辑我的代码？ –

根据预定义配置在HTML元素上设置动态验证条件

回答

相关问题