`
chaoyi
  • 浏览: 290164 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

后台jsp userNew.jsp

 
阅读更多
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<base href="<%=basePath%>">
<title></title>
<link rel="stylesheet" href="admin/css/basic.css" type="text/css" />
<link rel="stylesheet" href="admin/css/news.css" type="text/css" />
<script type="text/javascript" src="admin/js/userNew.js"></script>
</head>

<body>
	<form action="userNew" method="post" name="adminForm">
		<div class="fillIn">
			<table cellpadding="0" cellspacing="0">
				<tr class="explain">
					<td colspan="3">新增管理员</td>
				</tr>
				<tr class="item">
					<td class="key">管理员</td>
					<td class="value"><input type="text" id="admin" name="userId" /></td>
					<td class="prompt" id="adminId">(必填)</td>
				</tr>
				<tr class="item">
					<td class="key">密码</td>
					<td class="value"><input type="text" id="adminPass" name="password" /></td>
					<td class="prompt" id="adminPassId">(必填)</td>
				</tr>
				<tr class="item">
					<td class="key">真实姓名</td>
					<td class="value"><input type="text" id="name" name="username" /></td>
					<td class="prompt" id="nameId">(必填)</td>
				</tr>
				<tr class="item">
					<td class="key">手机号码</td>
					<td class="value"><input type="text" id="phone" name="phone" /></td>
					<td class="prompt" id="phoneId">&nbsp;</td>
				</tr>
				<tr class="update">
					<td colspan="3"><input type="submit" class="submit f_r"
						value="新增普通管理员" /></td>
				</tr>
			</table>
		</div>
	</form>
</body>
</html>

 

/* CSS Document */

.submit{ background:#f7661f; color:#fff; text-align:center; width:108px; height:21px; line-height:21px; border:none; border-radius:3px; font-family:"Arial";}
.submit:hover{ background:#ff971c;}

.submit2{ background:#f7661f; color:#fff; text-align:center; width:76px; height:21px; line-height:21px; border:none; border-radius:3px; font-family:"Arial";}
.submit2:hover{ background:#ff971c;}

.fillIn{ width:800px; margin:80px auto 0 auto;}
.fillIn table{ width:100%; border-top:1px solid #ccc; border-left:1px solid #ccc;}
.fillIn table td{ height:21px; text-align:center; border-bottom:1px solid #ccc; border-right:1px solid #ccc;}
.fillIn table .explain td{ background:#f4f4f4; font-family:"微软雅黑"; color:#333; font-weight:bold;}
.fillIn table .item .key{ background:#436da8; color:#fff; font-family:"微软雅黑"; width:180px; text-align:right; padding-right:10px;}
.fillIn table .item .value{ color:#333; font-family:"微软雅黑";}
.fillIn table .item .value input{ color:#c00; border:none; width:280px; font-family:"微软雅黑";}
.fillIn table .item .value select{ color:#c00; border:none; font-family:"微软雅黑";}
.fillIn table .item .value select option{ color:#c00; border:none; font-family:"微软雅黑";}
.fillIn table .item .prompt{ width:300px; text-align:left; padding-left:10px; color:#333; font-family:"微软雅黑";}

.fillIn table .update td{ height:28px; padding-right:10px;}

 

//JavaScript Document

function $(id){  
	return document.getElementById(id);  
} 

window.onload = function(){
	//管理员验证
	$("admin").onblur = function(){
		adminOnblur(this);
	};

	//密码验证
	$("adminPass").onblur = function(){
		adminPassOnblur(this);
	};

	//真实姓名验证
	$("name").onblur = function(){
		nameOnblur(this);
	};

	//手机验证
	$("phone").onblur = function(){
		phoneOnblur(this);
	};

	//给表单注册提交事件  
	document.adminForm.onsubmit = function(){  
		return check();
	};
};

function adminOnblur(obj){
	var adminId = $("adminId");
	if("" == obj.value){
		adminId.innerHTML="(必填)管理员账号不能为空";
		return false;
	}
	var regAdmin = /^[a-zA-Z][a-zA-Z0-9._-]{3,17}$/; 
	if(regAdmin.test(obj.value)==false){
		adminId.innerHTML="(必填)只能以字母开关,且长度为4-18";
		return false;
	}

	var xmlHttp = new XMLHttpRequest();
	var url = "ajaxUserNew?userId="+ escape(obj.value);
	xmlHttp.open("GET", url);//设置一个请求
	xmlHttp.onreadystatechange = function() {	//设置请求完成之后处理的回调函数  
		if (xmlHttp.readyState == 4) {//数据返回完毕  
			if (xmlHttp.status == 200) {//HTTP操作正常  
				var text = xmlHttp.responseText;//接收返回的内容 
				if(text != null){
					adminId.innerHTML= text;
				}
			}
		}
	};
	xmlHttp.send(null);//发送请求,不传递任何参数  
	return true;
}

function adminPassOnblur(obj){
	var adminPassId = $("adminPassId");
	if("" == obj.value){
		adminPassId.innerHTML="(必填)管理员密码不能为空";
		return false;
	}
	var regAdminPass = /^[a-zA-Z0-9]{6,16}$/;
	if(regAdminPass.test(obj.value)==false){
		adminPassId.innerHTML="(必填)密码由英文字母和数字组成的6-16位字符";
		return false;
	} 
	adminPassId.innerHTML="(必填)通过";
	return true;
}

function nameOnblur(obj){
	var nameId = $("nameId");
	if("" == obj.value){
		nameId.innerHTML="(必填)请输入正确的真实姓名";
		return false;
	}
	var regName = /^([\u4e00-\u9fa5]|\w+)+$/;  
	if(regName.test(obj.value)==false){  
		nameId.innerHTML ="(必填)只能由汉字或字母组成";  
		return false;  
	}     
	//把中文字符转换为两个字母,以计算字符长度  
	var len = obj.value.replace(/[\u4e00-\u9fa5]/g,"ab").length;  
	if(len<4 || len>20){   
		nameId.innerHTML ="(必填)长度为4-20个字符(一个汉字占两个字符)"; 
		return false;  
	}
	nameId.innerHTML="(必填)通过";
	return true;
}

function phoneOnblur(obj){
	var phoneId = $("phoneId");
	if("" == obj.value){
		phoneId.innerHTML="";
		return true;
	}  
	var regPhone = /^1(3|5|8)\d{9}$/;  
	if(regPhone.test(obj.value)==false){   
		phoneId.innerHTML ="手机号由11位数字组成,以13、15、18开头"; 
		return false;  
	}
	phoneId.innerHTML="通过";
	return true;
}


function check(){
	var admin = adminOnblur($("admin"));
	var adminPass = adminPassOnblur($("adminPass"));
	var name = nameOnblur($("name"));
	if(admin && adminPass && name ){
		return true;
	}
	return false;
}

 

效果图:

 

 

 

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

相关推荐

Global site tag (gtag.js) - Google Analytics