semantic-ui是否可以在一个字段上形成验证规则，并以不同字段为条件？

Question

假设我有两个字段的表单。我想下面是可能的：

提交空的形式 - 验证成功 两个字段包含数据 - 验证成功 一个字段有数据，场两空 - 验证成功 一个字段为空，第二场有数据 - 验证失败

有没有办法做到这一点？

我的服务器代码已经验证了这一点，但我希望能够防止客户端击中服务器，如果它不必......但如果这是不可能的，有没有办法通过表格在页面加载时向表单验证错误消息？

谢谢！

Answer 1

你可以使用正则表达式复杂的验证规则

先添加一些代码来form.js，这个文件是在访问：

语义的UI主\语义的UI主\ DIST \组件\ form.js

这个代码后

// is most likely an email 
email: function(value){ 
    var 
    emailRegExp = new RegExp("[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?", "i") 
    ; 
    return emailRegExp.test(value); 
}, 

添加以下代码

// is most likely an my regex 
regex: function(value,reg){ 
    var 
    regexRegExp = new RegExp(reg, "i") 
    ; 
    return regexRegExp.test(value); 
}, 

，并用它在你的语义UI代码，这样

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

例如，这是我的代码来验证一个复杂的鳕鱼只含有10位或字母的组合

  $("form[data-id=\"2\"]").form({ 
       v: { identifier: 'active_code', rules: [{ type: "regex[^[a3-z8]{10}$]", prompt: 'کد فعال سازی خود را وارد کنید'}] } 
      }, 
      { 
       inline: true, 
       on: 'blur', 
       transition: 'swing left', 
       duration: 1000, 
       onSuccess: formOnSuccess 
      } 
      ); 

完整代码

 $("form[data-id=\"1\"]").form({ 
      f: { identifier: 'family', rules: [{ type: 'empty', prompt: 'فامیلی خود را وارد کنید'}] }, 
      e: { identifier: 'email', rules: [{ type: 'email', prompt: 'ایمیل خود را وارد کنید'}] } 
     }, 
      { 
       inline: true, 
       on: 'blur', 
       transition: 'swing left', 
       duration: 1000, 
       onSuccess: formOnSuccess 
      } 
     ); 
     $("form[data-id=\"2\"]").form({ 
      v: { identifier: 'active_code', rules: [{ type: "regex[^[a0-z9]{10}$]", prompt: 'کد فعال سازی خود را وارد کنید'}] } 
     }, 
      { 
       inline: true, 
       on: 'blur', 
       transition: 'swing left', 
       duration: 1000, 
       onSuccess: loadPersonal 
      } 
     );