根據預定義配置在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元素上設置動態驗證條件

回答

相關問題