天天看點

jsf标簽 驗證器的使用

 jsf驗證器+正規表達式驗證 密碼,兩次密碼是否一緻功能。

 需求說明:

1,密碼和确認後面顯示(由10-15位字母或數字組成)

2,兩次密碼不一緻時在确認密碼後提示

3,更改内容後驗證通過再次提示資訊(由10-15位字母或數字組成)

實作代碼

1,頁面代碼

<span style="font-size:18px;"><h:form id="userForm">
	<h:panelGrid id="info" cellpadding="2" cellspacing="2" columns="3">
		<h:outputText value="密碼"/>
		<h:inputSecret id="pswd" style="white-space:nowrap" requiredMessage="必填"
	validatorMessage="由10-15位字母或數字組成" οnblur="check();">
			<rich:validator/>
			<f:validateRegex pattern="^[A-Za-z0-9]{10,15}$"/>
		</h:inputSecret>
		<rich:message id="passwordMsg" for="pswd" style="color:gray;"/>

		<h:outputText value="确認密碼"/>
		<h:inputSecret id="repswd" style="white-space:nowrap" requiredMessage="必填"
	validatorMessage="由10-15位字母或數字組成" οnblur="checkpswd();">
			<rich:validator/>
			<f:validateRegex pattern="^[A-Za-z0-9]{10,15}$"/>
		</h:inputSecret>
		<rich:message id="repasswordMsg" for="repswd" style="color:gray;"/>
	</h:panelGrid>
	
</h:form></span>
           

   validateRegex标簽中的patten内容為,校驗目前文本框輸入的内容格式;validatorMessage表示驗證不通過時顯示的内容,字型為紅色表示;onblur為失去焦點後出發的js方法。

   rich:message标簽為界面上提示資訊的标簽,與密碼框綁定。

2,js方法

<span style="font-size: 18px;">function check(){
	//擷取密碼後的提示資訊
	var passwd = document.getElementById("userForm:passwordMsg");
	//判斷是否為火狐浏覽器
	if(window.navigator.userAgent.toLowerCase().indexOf('firefox'!=-1)){
		if(passwd.textContent==""){
			passwd.style.color="groy";
			passwd.textContent="由10-15位字母或數字組成";
		}
	}else{
		if(passwd.innerText==""){
			passwd.style.color="groy";
			passwd.innerText="由10-15位字母或數字組成";
		}
	}
}
</span>
           
<span style="font-size:18px;">function checkpswd(){
	//擷取密碼,确認密碼及确認密碼後提示資訊
	var pswd = document.getElementById("userForm:pswd");
	var repswd = document.getElementById("userForm:repswd");
	var repasswd = document.getElementById("userForm:repasswordMsg");

	//判斷密碼是否一緻
	if(pswd.value!=repswd.value){
		//設定提示資訊為,密碼不一緻
		repasswd.style.color="red";
		if(window.navigator.userAgent.toLowerCase().indexOf('firefox'!=-1)){
			repasswd.textContent="密碼不一緻";
		}else{
			repasswd.innerText="密碼不一緻";
		}
	}else{
		//設定提示資訊為,由10-15位字母或數字組成
		repasswd.style.color="gray";
		if(window.navigator.userAgent.toLowerCase().indexOf('firefox'!=-1)){
			repasswd.textContent="由10-15位字母或數字組成";
		}else{
			repasswd.innerText="由10-15位字母或數字組成";
		}
	}
}</span>
           

繼續閱讀