如何使用jquery ajax保存Spring表单数据，而不刷新页面?

i try out this example... where student class object is getting at controller side. and we can use it directly. but here the page is getting submitted.

我尝试这个例子……学生类对象在控制器端。我们可以直接使用它。但是这一页正在被提交。

here i want it call the post method using jquery ajax and post data as class object. instead of sending each input field value.

在这里，我希望它使用jquery ajax调用post方法，并将数据作为类对象发布。而不是发送每个输入字段值。

how can i achieve this?

我如何做到这一点?

for example i want to send post request to this controller

例如，我想向这个控制器发送post请求

@RequestMapping(value = "/addStudent", method = RequestMethod.POST)
   public String addStudent(@ModelAttribute("SpringWeb")Student student, 
   ModelMap model) {
      //here will be my code to use student object....

      return "result";
   }

using this Spring form..

使用这个春天形式. .

<form:form method="POST" action="/HelloWeb/addStudent">
   <table>
    <tr>
        <td><form:label path="name">Name</form:label></td>
        <td><form:input path="name" /></td>
    </tr>
    <tr>
        <td><form:label path="age">Age</form:label></td>
        <td><form:input path="age" /></td>
    </tr>
    <tr>
        <td><form:label path="id">id</form:label></td>
        <td><form:input path="id" /></td>
    </tr>
    <tr>
        <td colspan="2">
            <input type="submit" value="Submit"/>
        </td>
    </tr>
</table>  
</form:form>

2 个解决方案

#1

I am going to answer with an existing question.. jQuery AJAX submit form

我要回答一个现存的问题。jQuery AJAX提交表单

For Spring's model attribute mapping to work, you only have to make sure the form input names stay consistent. The best way to progressively convert your traditional form submit to an ajax style form submit is to trap the form submit event, serialize the form and make an ajax call. Since all param names and values are going to remain consistent, your backend code will work as is.

对于要使用Spring的模型属性映射，您只需确保表单输入名称保持一致。逐步将您的传统表单提交到ajax样式表单提交的最佳方法是捕获表单提交事件、序列化表单并发出ajax调用。由于所有的param名称和值都将保持一致，所以后端代码将按原样工作。

Note: You will have to handle responses differently though, since a normal form submit returns the success or error page, while with ajax you'll need something else. But since this question is about form submission, won't go into details about response handling.

注意:您将不得不以不同的方式处理响应，因为正常的表单提交返回成功或错误页面，而使用ajax您将需要其他东西。但是由于这个问题是关于表单提交的，所以不会涉及到响应处理的细节。

Hope this answers your question.

希望这能回答你的问题。

#2

You will have to convert form values to json, and use and an ajax post request to submit data to server.

您必须将表单值转换为json，并使用ajax post请求向服务器提交数据。

I did it using the toObject plugin for jQuery. And the JSON stringify function.

我使用了jQuery的toObject插件。以及JSON stringify函数。

#1