表单验证

xml300

现在在做注册和登录功能，然后表单需要做验证，请问在X5下使用哪种方式比较好？
有看了data组件的规则验证，感觉不太适合
写了规划验证，也不知道怎样在点击注册或登录时触发

zhaixin

注册或登录是使用的button组件吧，在button组件的onclick事件中写js代码进行验证

xml300

zhaixin 发表于 2014-12-19 08:52
注册或登录是使用的button组件吧，在button组件的onclick事件中写js代码进行验证 ...

这个知道是通过onClick触发，我是说平台有没有提供相应的处理组件，比如说JS验证函数，出错提示等的封装！

zhaixin

x5没有提供这样的组件，但是可以通过bind来实现
例如：在input后放两个div，一个用来显示输入正确的信息，一个用来显示输入错误的信息
在这两个div上分别设置bind-visible属性，例如：$model.data1.val('aa') == '1'，也可以调用自定义的js方法
当data1的aa列的数据发生变化时，bind-visible会自动计算

xml300

zhaixin 发表于 2014-12-19 09:27
x5没有提供这样的组件，但是可以通过bind来实现
例如：在input后放两个div，一个用来显示输入正确的信息， ...

好的，理解了，谢谢！

XiaoQLuo

data组件的规则就是完成数据校验的；
data中的constraint规则是通用的js表达式规则，理论上可以实现任何的校验；
使用上可以通过data的api来获取校验的信息
data.isValid()判断是否满足约束；
data.getInvalidInfo()获取不满足的提示信息

关于data上的规则还支持email，pattern等规则(当然这些规则都可以使用constraint实现)
设计器目前没有支持，可以手工增加xml，描述如：
      <rule >
        <col name="fString">
          <required>
            <expr xid="default27">js:true</expr>  
            <message>请填写String</message>
          </required>
          <email>
           <message>请填写有效的email</message>
          </email>
        </col>
</rule>
同时也可以使用js代码的方式设置如：
data.ref('列').extendextend({ email: true });

cjp314

wex5真的是个很大的坑，把一些通用的库这改一点那改一点成自己的开源，开源的插件因为改动反而用不了