指间宝后台文档说明

运行指间宝项目,进入登录注册页面,注册采用bootstarpvalidator的验证,需要验证字段有 用户名、密码、联系人、手机号、服务电话和地址。以用户名验证为例,前台jsp页面<input name="uid" ${uc.uid} type="text" class="form-control" /> 此处的${uc.uid}是获取一些列的验证信息。浏览器检查可见

shops.java 代码:

/*在map存放一些uid的标准包括返回错误的信息*/

public class Shops extends questCab {
实体类的一些字段省略...
public Shops () {
		super();
		Map v = null;
	        /** [uid] ***/
 		v = new HashMap();
		v.put("columnName","uid");
		v.put("type","VARCHAR");
		v.put("jtype","String");
		v.put("valdef",null);
		v.put("remark","用户名");
		v.put("isnull",false);
		v.put("size",50);
		v.put("decimal_digits",0);
		v.put("ispk",false);
		v.put("cnname","用户名");
		v.put("regEx","[\\s\\S]{1,50}");
		v.put("regMsg","用户名输入格式不正确,必须填写,且长度不能超过50个字符");
		c.put("uid",v);
...
}

既然是注册,那么调用zhuce.java类
public class Zhuce extends PageMode {
       private Map<String, String> uc;

         public Map getUc() {
          return uc;
        }

    @Override
    public void init() throws Exception {
        uc = new HashMap();
        Shops u = new Shops();
        JSONObject t = new JSONObject();
        
        JSONObject _c = u.c;
        uc.put("atform", "qc");//表单值提交前缀

        //用户名
        JSONObject m = _c.getJSONObject("uid");
        t.put("min", 3);
        t.put("max", m.get("size"));
        m.put("stringLength", t);
        uc.put("uid", u.toChkHtmlAttr(m));

       //其他验证省略...
    }
}

打印出 uc.get("uid");结果如下:

cnname='用户名' isnull='false' regEx='[\s\S]{1,50}' regMsg='用户名输入格式不正确,必须填写,且长度不能超过50个字符' stringLength='{"min":3,"max":50}' 


对应jsp中就会显示如下:

<input name="pwd" cnname="密码" isnull="false" regex="[\s\S]{1,32}" regmsg="密码输入格式不正确,必须填写,且长度不能超过32个字符" identical="{"field":"pwd1","message":"两次密码不一致"}" different="{"field":"uid","message":"不能和用户名相同"}" stringlength="{"min":6,"max":32}" type="password" class="form-control" data-bv-field="pwd">

调用bootstrap-validator验证

//警告标贴
//qsel 容器(el,JQobj,id,class),$(qsel).append(this)
//str 默认显示内容(html)
//noshow 默认显示(boolean),true是
//返回warningTip对象(Element)
function warningTip(qsel,str,noshow){
	var qp=(qsel instanceof jQuery)?qsel:$(qsel);
	if(!qp[0]) return null;
	var qt=$(document.createElement("div")).css("font-weight","bold"),
		qe=$(document.createElement("div"))
			.addClass("alert alert-warning")
			.append('<a href="#" class="close" οnclick="$(this).parent().hide()">×</a>');
	if((str==undefined && noshow==undefined)||noshow) qe.css("display","none");
	if(str) qt.html(str);
	qp.append(qe.append(qt));
	qe[0].showstr=qp[0].showstr=function(str){qt.html(str);qe.show()};
	qe[0].hidestr=qp[0].hidestr=function(){qe.hide()};
	return qe[0];
}

//初始化bootstrapValidator验证器
//qsel form容器(el,JQobj,id,class)
//subfn 提交函数
//返回 bootstrapValidator对象
function initVtor(qsel,subfn){
	var qp=(qsel instanceof jQuery)?qsel:$(qsel);
	if(!qp[0]) return null;
	var sfn=$.isFunction(subfn)?
	subfn:function(qform,vtor,evt){vtor.defaultSubmit()},
	at=qp.attr("atform"),els={};
	qp[0].atform=at?at+".":"";
	$.each(qp[0].elements,
		function(i,el){
			if(!el.name) return;
			var qe=$(el), v={}, js,
				ctag=qe.attr("cnname"),
				rs=qe.parent().find("label[for="+el.name+"]").text();
			ctag=rs?rs:(ctag?ctag:"");
			rs=$.trim(qe.attr("isnull")+"");
			if(rs.length>0 && rs=="false"){
				v["notEmpty"]={
					message:ctag+"不能为空, 请填写"
				};
			}
			rs=$.trim(qe.attr("regEx")+"");
			if(rs!="undefined" && rs.length>0){
				v["regexp"]={
					regexp:$.trim(qe.attr("regEx")),
					message:qe.attr("regMsg")
				};
			}
			rs=$.trim(qe.attr("stringLength")+"");
			if(rs!="undefined" && rs.length>2){
				js=JSON.parse(rs);
				if(js){
					var a=[];
					if(js.min) a.push("不能小于"+js.min+"位");
					if(js.max) a.push("不能大于"+js.max+"位");
					js.message=ctag+a.join(", ");
					v["stringLength"]=js;
				}
			}
			rs=$.trim(qe.attr("identical")+"");
			if(rs!="undefined" && rs.length>2){
				js=JSON.parse(rs);
				if(js) v["identical"]=js;
			}
			rs=$.trim(qe.attr("different")+"");
			if(rs!="undefined" && rs.length>2){
				js=JSON.parse(rs);
				if(js) v["different"]=js;
			}
			if(!$.isEmptyObject(v))
				els[el.name]={validators:v}
	});
	var vtor=qp.bootstrapValidator({
		message:"该字段不能为空, 请填写",
		feedbackIcons: {
          valid: 'glyphicon glyphicon-ok',
          invalid: 'glyphicon glyphicon-remove',
          validating: 'glyphicon glyphicon-refresh'
        },
        //submitHandler:sfn,//版本号v0.5-dev以后不再支持submitHandler配置
        fields:els    
	}).on("success.form.bv",function(ev){
		ev.preventDefault();
		var qform = $(ev.target);
		var vtor = qform.data('bootstrapValidator');
		sfn(qform,vtor,ev);
	});
	console.dir(els);
	return vtor.data('bootstrapValidator');
}


提交表单的javascript:

var wtip=warningTip("#regForm");
            var fVtor=initVtor("#regForm",
            	function(qform,validator,evt){
                	//console.log(this,f);
                	wtip.hidestr();
                	var d=getjsform(qform),
                		a=qform[0].atform,pm={};//提交前缀
                	$.each(d, function(k,v) {
						//console.log(k,v);
						pm[a+k]=v;
					});
                	$.post(qform.attr("action"),pm,
						function(re){
							if(re.ok){
								alert("注册成功!"+re.msg);
								return;
							}
							wtip.showstr(re.msg);
							//alert(re.msg);
					},"json");
					return false;
                }
            );
			//console.log("......")
		    $('#resetBtn').click(function() {
		        fVtor.resetForm(true);
			    wtip.hidestr();
		    });


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值