`

SpringMVC接收页面表单参数 转

 
阅读更多
　　一个普通的表单。

　　表单的代码如下：

 

复制代码
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Add User</title>


<script type="text/javascript">
    //添加用户
    function addUser() {
        var form = document.forms[0];
        form.action = "${pageContext.request.contextPath}/user/addUser1";
        //form.action = "${pageContext.request.contextPath}/user/addUser2";
        //form.action = "${pageContext.request.contextPath}/user/addUser3";
        form.method = "post";
        form.submit();
    }
</script>

</head>
<body>
    <form>
        <table>
            <tr>
                <td>账号</td>
                <td>
                    <input type="text" name="userName">
                </td>
            </tr>
            <tr>
                <td>密码</td>
                <td>
                    <input type="password" name="password">
                </td>
            </tr>
            <tr>
                <td>&nbsp;</td>
                <td>
                    <input type="button" value="提交" onclick="addUser()">
                </td>
            </tr>
        </table>
    </form>
</body>
</html>
复制代码

　　1、直接把表单的参数写在Controller相应的方法的形参中

@RequestMapping("/addUser1")
    public String addUser1(String userName,String password) {
        System.out.println("userName is:"+userName);
        System.out.println("password is:"+password);
        return "/user/success";
    }

　　2、通过HttpServletRequest接收

复制代码
@RequestMapping("/addUser2")
    public String addUser2(HttpServletRequest request) {
        String userName = request.getParameter("userName");
        String password = request.getParameter("password");
        System.out.println("userName is:"+userName);
        System.out.println("password is:"+password);
        return "/user/success";
    }
复制代码

　　3、通过一个bean来接收

　　　　1）建立一个和表单中参数对应的bean

复制代码
public class User {
    
    private String userName;
    
    private String password;

    public String getUserName() {
        return userName;
    }

    public void setUserName(String userName) {
        this.userName = userName;
    }

    public String getPassword() {
        return password;
    }

    public void setPassword(String password) {
        this.password = password;
    }
}
复制代码

　　　　2）用这个bean来封装接收的参数

@RequestMapping("/addUser3")
    public String addUser3(User user) {
        System.out.println("userName is:"+user.getUserName());
        System.out.println("password is:"+user.getPassword());
        return "/user/success";
    }

 　　4、通过json数据接收

复制代码
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Add User</title>

<script type="text/javascript" src="${pageContext.request.contextPath}/resource/script/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $("#button_submit").click(function(){
            var name = $("#userName").val();
            var pass = $("#password").val();
            

            var user = {userName:name,password:pass};//拼装成json格式
            
            $.ajax({
                type:"POST",
                url:"${pageContext.request.contextPath}/user/addUser4",
                data:user,
                success:function(data){
                    alert("成功");
                },
                error:function(e) {
                    alert("出错："+e);
                }
            });
        });
    });
</script>

</head>
<body>
    <form>
        <table>
            <tr>
                <td>账号</td>
                <td>
                    <input type="text" id="userName" name="userName">
                </td>
            </tr>
            <tr>
                <td>密码</td>
                <td>
                    <input type="password" id="password" name="password">
                </td>
            </tr>
            <tr>
                <td>&nbsp;</td>
                <td>
                    <input type="button" id="button_submit" value="提交">
                </td>
            </tr>
        </table>
    </form>
</body>
</html>
复制代码

　　依然可以使用bean来接收json数据

@RequestMapping("/addUser4")
    public String addUser4(User user) {
        System.out.println("userName is:"+user.getUserName());
        System.out.println("password is:"+user.getPassword());
        return "/user/success";
    }

　　5、使用jQuery的serializeArray() 方法序列化表单元素

　　　　如果表单元素很多，手工拼装成json数据非常麻烦，可以使用jQuery提供的serializeArray()方法序列化表单元素，返回json数据结构数据。　　

复制代码
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Add User</title>

<script type="text/javascript" src="${pageContext.request.contextPath}/resource/script/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $("#button_submit").click(function(){
            
            //序列化表单元素，返回json数据
            var params = $("#userForm").serializeArray();
            
            //也可以把表单之外的元素按照name value的格式存进来
            //params.push({name:"hello",value:"man"});
            
            $.ajax({
                type:"POST",
                url:"${pageContext.request.contextPath}/user/addUser5",
                data:params,
                success:function(data){
                    alert("成功");
                },
                error:function(e) {
                    alert("出错："+e);
                }
            });
        });
    });
</script>

</head>
<body>
    <form id="userForm">
        <table>
            <tr>
                <td>账号</td>
                <td>
                    <input type="text" id="userName" name="userName">
                </td>
            </tr>
            <tr>
                <td>密码</td>
                <td>
                    <input type="password" id="password" name="password">
                </td>
            </tr>
            <tr>
                <td>&nbsp;</td>
                <td>
                    <input type="button" id="button_submit" value="提交">
                </td>
            </tr>
        </table>
    </form>
</body>
</html>
复制代码

　　依然可以使用bean来接收json数据：

@RequestMapping("/addUser5")
    public String addUser5(User user) {
        System.out.println("userName is:"+user.getUserName());
        System.out.println("password is:"+user.getPassword());
        return "/user/success";
    }
分享到：
| spring mvc 表单提交乱码
评论
发表评论

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

相关推荐

    SpringMVC接收页面表单参数

    SpringMVC接收页面表单参数 SpringMVC是基于Java实现的 Model-View-Controller（MVC）模式的Web应用框架，它提供了许多强大和灵活的特性来处理Web请求。其中，接收页面表单参数是Web应用中非常常见的需求。下面...

    springmvc 第二个例子（接收表单参数+重定向）

    在这个“springmvc 第二个例子”中，我们将探讨如何通过Spring MVC接收表单参数并执行重定向。 首先，让我们理解接收表单参数的过程。在Web应用中，用户通常通过HTML表单提交数据。Spring MVC提供了一个强大的机制...

    springmvc-form表单的使用

    在Controller中，可以通过方法参数来接收这些数据。例如，可以定义一个接受`MyPojo`类型参数的方法来处理提交的数据。 ```java @RequestMapping(value = "/submit", method = RequestMethod.POST) public String ...

    Spring In Action SpringMVC 提交表单

    总结，SpringMVC提供了一套完整的解决方案来处理表单提交，从接收请求到数据验证，再到视图呈现，整个过程简洁高效。理解并熟练运用这些概念和机制，能帮助开发者构建出更加健壮和可维护的Web应用。在实际开发中，应...

    SpringMVC入门很简单之表单标签

    它需要指定`commandName`属性，该属性值对应于控制器方法参数的名称，用于绑定表单数据。例如： ```jsp ``` 3. ****：用于创建输入字段，自动绑定模型属性。如： ```jsp 请输入用户名"/&gt; ``` `path`属性...

    基于注解的springmvc进行form表单操作

    这样，我们就完成了从表单接收数据，将其保存到MySQL数据库的过程。需要注意的是，实际项目中还需要处理异常、数据验证、安全性等问题。此外，为了防止密码明文存储，通常会在保存前对密码进行加密。 总的来说，...

    详解SpringMVC——接收请求参数和页面传参

    在Spring MVC框架中，接收请求参数和向页面传递数据是两个关键操作，它们构成了Web应用中数据交互的基础。本文将详细解析如何在Spring MVC中实现这些功能。 首先，我们来看如何**接收请求参数**： 1. **使用...

    SpringMVC接收前台传递过来的值的实例

    本文将为大家分享SpringMVC接收前台传递过来的值的实例，包括通过HttpServletRequest、参数名和@RequestParam注解三种方式。 一、通过HttpServletRequest获得前台传来的值 在SpringMVC中，可以通过...

    SpringMVC杂记(三) 向导型Controller的实现(基于SpringMVC 3.1.1)

    在这个例子中，我们在重定向到"final-step"页面时，传递了一个"success"参数。 4. 视图解析： 最后，我们使用视图解析器（如InternalResourceViewResolver）来将视图名称映射到实际的JSP或HTML页面。例如，"step2...

    SpringMVC+jsp之表单验证登录

    在这个"SpringMVC+jsp之表单验证登录"的主题中，我们将探讨如何利用SpringMVC和JSP来实现用户登录功能，包括表单验证和交互流程。 首先，我们需要理解SpringMVC的核心组件。DispatcherServlet是入口点，负责接收...

    SpringMVC 入门小程序

    本入门程序旨在帮助初学者理解并掌握SpringMVC的基本概念和工作流程，通过实现用户在前端页面注册信息并显示的功能，来深入剖析其核心机制。 ### 1. SpringMVC框架概述 SpringMVC是Spring框架的一部分，提供了一个...

    SpringMVC详解

    SpringMVC提供了强大的数据绑定功能，可以自动将请求参数绑定到控制器方法的参数上，也可以将模型对象的属性绑定到HTML表单字段。这包括对基本类型、复杂类型以及集合类型的绑定。 7. **处理器拦截器** 处理器...

    SpringMVC Demo_java_springmvc_DEMO_

    6. **数据绑定和验证**：SpringMVC提供数据绑定功能，可以直接将请求参数绑定到Controller方法的参数上。此外，还可以使用`@Valid`注解和JSR-303/JSR-349 Bean Validation进行表单验证。 7. **异常处理**：...

    springMVC图片上传示例

    开发者需要在表单中设置`enctype="multipart/form-data"`，然后在控制器方法中声明`MultipartFile`参数来接收上传的文件。 三、多图上传 在本示例中，支持多图上传意味着用户可以一次选择并提交多个图片文件。这...

    SpringMVC之表单提交===①===普通表单

    表单页面应包含一个`&lt;form&gt;`元素，其中的`action`属性指向控制器的提交方法。 ```html &lt;!DOCTYPE html&gt; 表单提交 表单提交示例 姓名: &lt;input type="text" id="name" name="name" required&gt;&lt;br&gt; 邮箱: ...

    SpringMVC用户登录实例详解

    SpringMVC通过ModelAndView或直接返回字符串视图名来渲染对应的JSP页面。JSP页面中，我们使用EL（Expression Language）和JSTL（JavaServer Pages Standard Tag Library）来与后台数据交互。 4. **数据绑定**： ...

    SpringMVC完整demo.zip

    SpringMVC提供了多种方式来接收和处理POST请求中的数据。通常，我们可以创建一个与请求参数匹配的Java对象，然后使用`@ModelAttribute`注解将请求参数绑定到这个对象上： ```java @PostMapping("/submitData") ...

    SpringMVC+Ajax异步上传图片并显示(源码)

    在这个例子中，`@RequestParam("file") MultipartFile file`参数用于接收前端上传的文件。`MultipartFile`是Spring MVC提供的一个接口，用于处理多部分表单数据，如文件上传。 接下来，我们需要在前端使用Ajax来...

    springmvc学习第一天

    2. **参数绑定**：SpringMVC支持多种类型的参数绑定，包括简单类型、POJO（Plain Old Java Object）、集合类型等。 3. **自定义参数绑定**：对于更复杂的需求，开发者可以通过实现自定义的参数绑定器来处理。 #### ...

    超级详细SpringMVC学习资料

    1. DispatcherServlet：它是SpringMVC的前端控制器，负责接收请求并根据配置的映射规则选择合适的处理器。 2. Controller：控制器是业务逻辑处理的地方，通常由实现了Controller接口或标注了@Controller注解的类来...

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