`

Web开发10：对复杂表单进行客户端服务端验证

 
阅读更多

对上面这个用户基本信息页面进行客户端与服务器端的验证，下面是验证条件

用户名与密码不能为空，且长度在4与10之间。

性别必须选择一个，兴趣也必须选择一个，不能超过三个。

地址不作要求，说明必填。

userlogin.jsp

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<head>
	<script type="text/javascript">	
		function validate(){
			var username = document.getElementsByName("username")[0];
			var password = document.getElementsByName("password")[0];
			var gender = document.getElementsByName("gender");
			var interest = document.getElementsByName("interest");
			var comment = document.getElementsByName("comment")[0];
			if(username.value.length < 1){
				alert("用户名不能为空")
				return false;
			}
			if(password.value.length < 1){
				alert("用户密码不能为空")
				return false;
			}
			if(username.value.length <4 || username.value.length >10){
				alert("用户名长度必须大于等于4小于等于10")
				return false;
			}
			if(password.value.length <4 || password.value.length >10){
				alert("用户密码长度必须大于等于4小于等于10")
				return false;
			}
			if(!gender[0].checked && !gender[1].checked){
				alert("必须选择一个性别");
				return false;
			}
			var n = 0;
			for(var i =0;i<interest.length;i++){
				if(interest[i].checked){
					n++;
				}
			}
			if(n<1){
				alert("兴趣至少应选择一项");
				return false;
			}
			if(n == 4){
				alert("兴趣不能超过三项");
				return false;
			}
			if(comment.value.length <1){
				alert("说明必须填写");
				return false;
			}
			return true;
		}
	</script>
</head>
<html> 
  <body>
  	<form onsubmit="return validate();" action="UserValidateServlet"> 
  		用户名：<input type="text" name="username"/><br>
  		密  码：<input type="password" name="password"/><br>
  		性别： 男<input type="radio" name="gender" value="男"/>&nbsp;&nbsp; 女<input type="radio" name="gender" value="女"/><br>
  		兴趣：足球<input type="checkbox" name="interest" value="足球"/>&nbsp;&nbsp;
  		篮球<input type="checkbox" name="interest" value="篮球"/>&nbsp;&nbsp;
  		排球<input type="checkbox" name="interest" value="排球"/>&nbsp;&nbsp;
  		羽毛球<input type="checkbox" name="interest" value="羽毛球"/>&nbsp;&nbsp;<br>
  		地址：
  		<select name="address">
  			<option value="上海">上海</option>
  			<option value="北京">北京</option>
  			<option value="天津">天津</option>
  		</select>
  		<br>
  		说明：
  		<textarea name="comment" rows="15" cols="20"></textarea><br>
  		<input type="submit" value="点击确认">&nbsp;&nbsp;&nbsp;<input type="reset" value="重置">
  	</form>
  </body>
</html>

 

服务器端验证：新建一个Servlet

UserValidateServlet.java

package com.test.servlet;

import java.io.IOException;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class UserValidateServlet extends HttpServlet {

	public void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		String username = request.getParameter("username");
		String password = request.getParameter("password");
		String gender = request.getParameter("gender");
		String[] interest = request.getParameterValues("interest");
		String address = request.getParameter("address");
		String comment = request.getParameter("comment");
		List<String> list = new ArrayList<String>();
		
		if(username == null || password == null){
			list.add("用户名或密码不能为空");
		}
		if((username.length() <4 || username.length() >10) || (password.length() <4 || password.length() >10)){
			list.add("用户名或密码的长度不能小于4或大于10");
		}
		if(gender == null){
			list.add("性别必须选择");
		}
		if(comment == null){
			list.add("评论不能为空");
		}
		if(interest == null || interest.length > 3){
			list.add("兴趣不能为空或选择不能超过3个");
		}
		if(list.isEmpty()){
			request.setAttribute("username", username);
			request.setAttribute("password", password);
			request.setAttribute("gender", gender);
			request.setAttribute("interest", interest);
			request.setAttribute("address", address);
			request.setAttribute("comment", comment);
			request.getRequestDispatcher("loginSuccess.jsp").forward(request, response);
		}else{
			request.setAttribute("list", list);
			request.getRequestDispatcher("loginFail.jsp").forward(request, response);
		}
	}

	public void doPost(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		super.doPost(request, response);
	}

}

 

分享到：
| Web开发9：JavaBean
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    spring mvc服务端表单验证实例

    在Web应用中，服务端验证是必要的，因为客户端验证可能被绕过。服务端验证确保所有提交的数据都符合预设的规则，例如非空、长度限制、格式校验等。Spring MVC提供了一套强大的工具来实现这一目标。 3. **使用注解...

    文件上传 (服务端+客户端)

    文件上传是Web应用程序中常见的功能，它允许用户将本地计算机上的文件发送到服务器进行存储、处理或分享。在这个场景中，我们关注的是“文件上传 (服务端+客户端)”，这通常涉及到一个完整的流程，包括客户端的文件...

    客户端与服务端的交互实现（AndroidStudio+JavaEE开发）

    在这个项目中，客户端实现了注册和登录功能，这需要创建输入表单，处理用户输入，验证数据有效性，并将数据发送到服务端。Android Studio的XML布局文件用于设计界面，而Java代码则处理逻辑。 3. **HTTP请求与响应**...

    文件上传源码 客户端服务端

    在这个场景下，"文件上传源码 客户端服务端" 提供了实现这一功能的代码示例，包括客户端和服务端两部分，使用的技术有Socket和HTTPClient。 首先，让我们详细探讨客户端部分。在"FileUploadExample"中，客户端通常...

    Android客户端+web服务端实现图片上传

    在Android客户端与Web服务端实现图片上传的过程中，涉及到的关键技术和知识点包括Android应用开发、网络通信、文件处理以及Java EE服务器端编程。以下是这些领域的详细解释： 1. **Android客户端开发**： - **...

    客户端脚本调用服务端静态方法----PageMethods.doc

    在Web开发中，客户端与服务端的交互是非常常见且重要的环节。传统的做法是通过表单提交或者Ajax请求来完成数据交换。然而，在ASP.NET AJAX框架中，引入了PageMethods特性，允许开发者直接从客户端脚本调用服务端的...

    C# 一个简单的 Restful 服务端和 Restful 客户端 Demo

    这个C#的RESTful服务端和客户端Demo，旨在帮助开发者快速理解和实践RESTful API的设计和实现，是学习和开发相关应用的良好起点。通过实际操作和修改这个Demo，你可以更深入地了解RESTful架构的精髓以及C#在Web服务...

    pdf表单提交-服务端接收处理显示.zip

    服务端需要监听POST请求，解析接收到的PDF表单数据，并对其进行处理。 4. **C#处理PDF数据**： C#可以通过多种库来处理接收到的PDF数据，例如iTextSharp或PDFsharp。这些库可以读取PDF中的表单域值，将它们转换...

    ASP.NET MVC5验证系列之服务端验证

    客户端验证通常使用JavaScript在浏览器中进行，而服务端验证作为第二道防线，即使客户端验证被绕过，也能确保数据的正确性。 总结来说，ASP.NET MVC5的服务端验证是一个强大的功能，可以帮助开发者创建健壮的Web...

    Form验证表单Form验证表单

    2. 服务端验证：无论客户端验证是否成功，服务器都会对数据进行二次校验，这是保证数据安全的关键步骤，因为客户端验证可被篡改。 三、EasyValidator：一个强大的JavaScript验证库 `EasyValidator`是压缩包中的...

    ASP.NET中英文混合特效服务端验证控件v1.01

    服务端验证对于防止恶意用户绕过客户端验证尤其重要。 这个控件v1.01专注于中英文混合验证，意味着它可以识别并验证包含中文和英文字符的输入。在国际化的网站中，这样的功能至关重要，因为它允许全球用户使用他们...

    Android多文件上传客户端和服务端

    - 对客户端和服务端进行全面的单元测试和集成测试，确保在各种情况下上传都能正常工作。 - 性能测试：检查上传速度、服务器负载以及在高并发情况下的稳定性。 7. **合规性**： - 遵守相关的隐私政策和法律法规，...

    java表单的验证

    2. **服务端验证**：在服务器端进行数据校验，确保数据安全，防止客户端篡改。 #### 四、Java表单验证技术 在Java中，常用的表单验证技术有： - **使用JavaBean验证** - **Spring框架中的数据绑定和验证** - **...

    表单验证详细教程（chm）

    《表单验证详细教程》是一本专注于Web开发中表单验证技术的指南，主要针对HTML、JavaScript以及服务器端验证进行深入讲解。表单验证在Web应用程序中起着至关重要的作用，它确保用户输入的数据符合预设的规范，从而...

    基于浏览器的 服务端控制客户端弹窗

    在IT领域，基于浏览器的服务器端控制客户端弹窗是一种常见的交互技术，特别是在Web应用程序中。这种技术允许服务器向用户浏览器发送指令，以显示警告、确认信息或其他重要通知。本示例涉及一个简单的B/S（Browser/...

    struts2+Mysql搭建的服务端 +android 客户端 post，get请求

    开发过程中，确保客户端和服务端的安全性至关重要，比如对敏感数据进行加密传输，防止SQL注入攻击等。 总结起来，"struts2+Mysql搭建的服务端 +android 客户端 post，get请求"这个项目涵盖了Web服务开发的多个关键...

    Validator验证框架 回顾ActionForm的表单验证,掌握Validator验证框架.zip

    在IT行业中，表单验证是Web应用程序开发中的关键环节，它确保用户输入的数据符合预期的格式和规则，从而保证数据的准确性和系统的安全性。在.NET框架下，C#语言提供了多种方式进行表单验证，其中Validator验证框架是...

    socket实现客户端与服务器端UDP传输

    在实际开发中，我们还需要考虑安全性问题，如使用HTTPS加密传输、对密码进行哈希处理等，以防止数据在传输过程中被窃取。 总的来说，通过Socket实现客户端与服务器端的UDP传输，结合HTTP POST方法提交用户名和密码...

    AngularJS表单和输入验证实例

    - 服务端验证是必要的，因为客户端验证容易被绕过，故重要的数据验证必须在服务器端进行。 通过上述知识点，开发者可以在AngularJS中创建功能强大且用户友好的表单。需要注意的是，文章内容提到了一些OCR扫描错误...

    FileUpload控件上传文件客户端验证格式

    因此，无论客户端验证多么完善，服务端验证仍然是必要的。服务端验证应该始终被视为安全的最后防线，以确保上传的文件符合所有的安全和业务规则。 六、服务端验证 在C#中，服务端验证可以通过以下方式实现： ```...

Magicbox
Global site tag (gtag.js) - Google Analytics