语义UI表单validation – 仅在值不为空时才validation某些表单字段

我有一个表单，其中包含所需的字段以及可选的字段。 我正在使用Semantic UI的表单validation行为来validation字段。

但是，我想要实现的是表单validation行为仅在可选字段中包含值时validation它们。

示例可选字段：

 First name   

必填字段示例：

 
 E-mail address   

我试了一下，省略了emptyvalidation规则但是没有用。

是否内置了表单validation行为可以帮助我实现这一点，还是需要为可选字段编写自定义validation？

Answer 1

更新：此function现已在1.2.0版中实现。 可以使用相同的optional标志： https ： //semantic-ui.com/behaviors/form.html#optional-fields

以前的语义版本<1.2.0的anwser和解决方案：

通过扩展Semantic UI表单validation行为，我设法为可选字段制定了可行的解决方案。

首先，我为每个规则集添加了一个optional标志。 这可以设置为true或false ：

 firstname: { identifier: "first_name", optional: true, rules: [ { type: "regex[^[a-zA-Z -]+$]", prompt: "First name can only consist of letters, spaces and dashes" } ] } 

然后我搜索了处理每个字段validation的函数，并在那里通过添加if语句来扩展它，以检查optional标志是否设置为true且值为空。 如果条件为true，则跳过空字段的validation并返回为有效。

该函数可以在未压缩的semantic.js找到4600行左右，或者搜索函数注释：

 // takes a validation object and returns whether field passes validation field: function(field) { var $field = module.get.field(field.identifier), fieldValid = true, fieldErrors = [] ; if(field.optional && $.trim($field.val()) == ""){ module.debug("Field is optional and empty. Skipping", field.identifier); return true; } if(field.rules !== undefined) { $.each(field.rules, function(index, rule) { if( module.has.field(field.identifier) && !( module.validate.rule(field, rule) ) ) { module.debug('Field is invalid', field.identifier, rule.type); fieldErrors.push(rule.prompt); fieldValid = false; } }); } if(fieldValid) { module.remove.prompt(field, fieldErrors); $.proxy(settings.onValid, $field)(); } else { formErrors = formErrors.concat(fieldErrors); module.add.prompt(field.identifier, fieldErrors); $.proxy(settings.onInvalid, $field)(fieldErrors); return false; } return true; } 

Answer 2

您可以轻松地使用JQuery Validation插件。 尝试一下

http://jqueryvalidation.org/