Spring Portlet Jquery Ajax post to Controller

Question

EDIT:

The startdate and enddate are joda dateTime in the POJO and the error I get is:

SystemOut     O 14:10:16.040 [WebContainer : 2] DEBUG org.springframework.beans.BeanUtils - No property editor [org.joda.time.DateTimeEditor] found for type org.joda.time.DateTime according to 'Editor' suffix convention
...
SystemOut     O Error::Failed to convert property value of type 'java.lang.String' to required type 'org.joda.time.DateTime' for property 'startTimestamp'; nested exception is java.lang.IllegalStateException: Cannot convert value of type [java.lang.String] to required type [org.joda.time.DateTime] for property 'startTimestamp': no matching editors or conversion strategy found

I also can't edit the Pojo and add @DateTimeFormat because the Pojos are generated from XSD. I also tried adding a customObjectMapper, but nothing works. Any help would be much appreciated.

Original Question:

I'm trying to submit a form and send the data to the Controller method. The issue is the ModelAttribute is empty and does not have the values. Spring MVC Portlet + Jsp + Javascript + Jquery + Controller @ResourceMapping

Snippet:

JSP:

<portlet:resourceURL id="addNewURL" var="addNewURL">
    </portlet:resourceURL>  

<form:form id="qmat_new_notification_form" action="#" method="POST" modelAttribute="dataObject">    
  ...
  <input type="text" class="date-picker" id="start_date">
  ...    
  <input type="submit" value="Save" class="button" onclick="addNew()">    
</form:form>

Jquery:

function addNew() { 

            var dataObject = JSON.stringify({
                'startTime': $('#start_date').val(),
                'endTime': $('#end_date').val(),
                'description': $('#message').val(),
                'active': $('#status').val()
            });

            alert("data::"+dataObject);

            $.ajax({
                url: "<%=addNewURL%>",
                type: 'POST',
                contentType: 'application/json',
                data: dataObject
            }).done(function(json){         
alert("Success!");
//more logic    
            }).fail(function() {
                alert("OOPS!");
            });
        }

Controller:

    @ResourceMapping(value = "addNewURL")
        public void addNew(@ModelAttribute(value = "dataObject") Obj n,
                            BindingResult bindingResult, ResourceRequest request, ResourceResponse response, ModelMap model) {

            if (!bindingResult.hasErrors()) {
                System.out.println("a:::"+n.getDescription());
}

This getDescription is null. Also if I use request.getParameter("description") is also null. What am I missing? Please help

Answer 1

You don't need to work with JSON data at all.

First, avoid stringification of dataObject:

var dataObject = {...}; // no JSON.stringify call

Second, remove contentType: 'application/json' as it doesn't make sense in this case.

With dataObject being a key/value pair and default contentType, the POST request will be constructed correctly.

To handle both click and submit events, I suggest to jQuery click and submit methods:

$("#submit").click(function (event) {
    addNew();
    event.preventDefault();
});
$("#submit").submit(function (event) {
    addNew();
    event.preventDefault();
});

I've created a fiddle for the question.

See jQuery.ajax documentation.