fastadmin nice validator remote验证 json数据 ajax 验证失效

1、背景

最近接触到fastadmin，在处理表单验证方面，fastadmin使用的是Nice-validator验证插件，刚开始用着还挺爽，表单的验证也挺方便，毕竟人家已经提供了很多的验证规则，但是有这么个需求，那就是修改个人信息时需要确保账号的唯一性，也就是唯一性验证，这个人前端也想到了，给了你一个remote()远程验证，这个函数还可以传参数，逗号隔开即可，看起来也挺方便，但用起来有些困难。。。。
2、问题

先谈需求：1、账号唯一性验证 　　2、其它字段的验证　　3、ajax提交　　

再来看看具体遇到哪些问题：

1、远程验证remote 这玩意官网上说　 （图在下面） 　　　返回字符串说是可以直接显示，我后端用的php，我return 字符串也不行， 它说还有统一格式 $this->success('ok')，这样说也行，那行吧，人家官网上说格式统一，那咱试试，结果不显示信息，就是不管是否唯一，后端会返回一个msg，展示到前端页面上给用户看，但是$this->success()返回的是个json（我的这个success（）返回的是json），好吧，json，人家官网也有说json数据咋处理，照着官网的代码走一遍，结果。。。。。。js报错，提示说validator 不是个函数。。。。。我也是醉了，看看jq，有啊，看看jQuery.validator.js也有，顺序也没错。。。。有点让人无语　　　　然后想着用input的失去焦点blur函数来触发这个 验证 于是我就将 $('#form').validator()函数 写在了 blur函数里面，然后 还真别说，真的能用，，，，，

2、remote 能用了，也能显示msg信息了（如何显示msg信息？获取到了data中的msg然后用js添加到页面即可！有没有自动，fastadmin给我们准备好了的那种？不好意思，母鸡啊），但是其他字段的验证规则有失效了。。。。。然后没办法，在看看官方文档吧，就看到验证规则有两种绑定方式，一种是dom，一种是js，我好像两种都用了，那可以理解为啥其它字段的验证规则不能用了，冲突了，只能二选一，可是dom已经绑定了，不想再用js绑定了，这简单啊，把那个validator删掉，直接用jq，当input失去焦点时发起个ajax请求就完事了

3、ajax提交，发现验证成不成功都能发起ajax，毕竟ajax那玩意儿只要单击了就给你发起ajax了，而且ajax提交会导致验证只生效一次，第二次没反应。。。。

js加载图片：

3、解决办法
先贴出html
复制代码

<form id="changepwd-form" class="form-horizontal" role="form" data-toggle="validator"

                              autocomplete="off">

                            <div class="form-group">
                                <label for="username" class="control-label col-xs-12 col-sm-2">名称:</label>
                                <div class="col-xs-12 col-sm-4">
                                    <input type="text"
                                           data-rule="required;"
                                           id="username" name="username"
                                           class="layui-input form-control input-none" placeholder="姓名"
                                           value="{$username}">
                                    <div id="username_msg" style="color: red"></div>
                                </div></div>

                            <div class="form-group">
                                <label for="mobile" class="control-label col-xs-12 col-sm-2">联系手机号:</label>
                                <div class="col-xs-12 col-sm-4">
                                    <input type="text" data-rule="required;mobile" id="mobile" name="mobile"
                                           class="layui-input form-control input-none" placeholder="手机号"
                                           value="{$mobile}">
                                </div>
                            </div>

                                <label class="control-label col-xs-12 col-sm-2"></label>
                                <div class="col-xs-12 col-sm-8 apply-submit">
                                    <button type="button" id="editBtn" class="check-btn">确定修改</button>
                                </div>
                            </div>

标签: none