`

bootstrap的js插件 sco.js之表单验证

 
阅读更多

验证插件:

http://www.bootcss.com/p/sco.js/#valid

验证方法:

在html界面中通过正则表达式等静态验证:

html:

      <label>
                <div >
                    email:
                </div>
                <input type="text" id="email" name="email">
                <span class="message">&nbsp;</span>
      </label>

 

js:

$('#valid_form').scojs_valid( {

			rules : {
				title : [ 'not_empty' ],
				content : [ 'not_empty' ]
			},
			onSuccess : function(response, validator, $form) {
			}
			,onError: function(response, validator, $form) {...}
			,onFail: function(response, validator, $form) {...}
	});

后台验证结果按照Jsend的方式组包:

Jsend:

http://labs.omniti.com/labs/jsend

 

后台验证返回结果分3种:

成功:{"status":"success","data":{"next":"http://google.com"}}

失败:{"status":"fail","data":{"errors":{"email":"This error comes from server side"}}}

错误:{"status":"error","message":"The server made a boo boo"}

对3种结果分析:

成功:对数据操作成功,可以跳转到指定界面或者弹出提示(需引入sco.message.js).

失败:数据操作过程失败,比如新建一个用户,但是用户名已经存在,那么返回失败信息,界面上可以直接定位到失败字段,然后在后面输出失败信息。

错误:未知错误,直接弹出提示(需引入sco.message.js).

 

如果在界面引入了sco.message.js,那么:

(1).如果静态验证(scojs_valid)中onSuccess等函数有声明,则先执行函数,然后弹出sco.message的提示。

(2).如果想不弹出提示,而单单执行回调函数,则返回组包应这样:{"status":"success(fail/error)","data":"null"}

(3).待续。

  • 大小: 167.5 KB
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics