@ModelAttribute spring mvc portlets and ajax form submit

user525146 picture user525146 · Aug 15, 2012 · Viewed 7.2k times · Source

Sorry for my poor english. I have many things going on in my mind which are confusing me literally. I want to handle the form submitted values as @ModelAttribute which is confusing me in the first place. Without using the @ModelAttribute I am good and have everything working perfectly.

My requirements are to handle ajax form submit in portlets and spring mvc 3.0 annotations

Form I have

<portlet:resourceURL var="userURL" id="addUser" escapeXml="false" />

<form id="<portlet:namespace />User>
<table>
<tr><td>First Name: </td>
    <td><input type="text" name="fname"></td></tr>
<tr><td>Last Name: </td>
    <td><input type="text" name="lname"></td></tr>
<tr><td>Address 1: </td>
    <td><input type="text" name="address_1"></td></tr>
<tr><td>Address 2: </td>
    <td><input type="text" name="address_2"></td></tr>
<tr><td>Zipcode </td>
    <td><input type="text" name="zipcode"></td></tr>
<tr><td>&nbsp; </td>
    <td><button id="submit">Submit</td></tr>

</table>
</form>

I use the following jQuery to submit the form as an ajax call

$('#submit').on('click',function() {
   var fname = $('#fname').val();
   var lname = $('#lname').val();
   var address_1 = $('#address_1').val();
   var address_2 = $('#address_2').val();
   var zipcode = $('#zipcode').val();

   $.ajax({
      type: "POST"
      url: "<c:out value="${userURL}" />"
      data: {fname: fname, lname: lname, address_1: address_1, address_2: address_2,         zipcode: zipcode }
      success: function(data) {
                   if(data == "success") {
                      $('#showError').hide();
                   } else {
                      $('#showError').show();
                   }
      } 
   })

});

I have the following controller to handle the ajax call

@Controller
@RequestMapping("VIEW")
public class UserController {

       @ResourceMapping("addUser")
       public String addUser(ResourceRequest request, ResourceResponse response) {
            String fName = request.getParameter("fname");
            String lName = request.getParameter("lname");
            String address_1 = request.getParameter("address_1");
            String address_2 = request.getParameter("address_2");
            String zipcode = request.getParameter("zipcode");

            // I do the processing of the form and add the user attributes to the database.
       }

}

I have created a User class and I want to use @ModelAttribute to set/get the values. I have gone through many links trying to figure out using it. One of the examples out uses the form taglib. I have jQuery to submit the form as an ajax call and I am not sure if I change the form to this pattern it will break my code.

<%@taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<form:form method="post" action="addContact.html">

    <table>
    <tr>
        <td><form:label path="firstname">First Name</form:label></td>
        <td><form:input path="firstname" /></td> 
    </tr>
    <tr>
        <td><form:label path="lastname">Last Name</form:label></td>
        <td><form:input path="lastname" /></td>
    </tr>
    <tr>
        <td><form:label path="lastname">Email</form:label></td>
        <td><form:input path="email" /></td>
    </tr>
    <tr>
        <td><form:label path="lastname">Telephone</form:label></td>
        <td><form:input path="telephone" /></td>
    </tr>
    <tr>
        <td colspan="2">
            <input type="submit" value="Add Contact"/>
        </td>
    </tr>
</table>    

</form:form>

Thanks for the help!

Answer

Mark Chorley picture Mark Chorley · Apr 29, 2013

In order to get the @modelAttribute working, I think you need to add a modelAttribute attribute to your form tag to map the ModelAttribute to user:

<form:form modelAttribute="User" action="yourResourceUrl">

Have I used the word "Attribute" enough in this answer yet?

You may end up wanting to populate the form with a Command or FormBackingObject which would also be an instance of User. In this case you can use the commandName attribute in place of modelAttribute and it will both map the form to the User for population, and map User to the @ModelAttribute annotation on your controller.