使用Spring MVC和AJAX处理的对象列表(using Spring MVC and ajax

使用AJAX和Spring MVC，如何返回从春季控制器对象的列表，并使用jQuery显示它们。

下面让Ajax请求：

$.ajax({
                    type: "POST",
                    url: "allUser.html",
                    dataType:'json',

                    data: "select=" + selectedCheckboxArray,
                    success: function(data){
                        var userListContent="";
                         var json =data.message;
                        $.each(json, function(i, obj) {


                            userListContent=userListContent+"<tr>";
                            userListContent=userListContent+"<td><input type='checkbox' value='"+obj.id+"'  id='select' name='select'/></td> ";
                            userListContent=userListContent+"<td id='NameColumn'>"+obj.firstName+" "+obj.lastName +"</td>";
                            userListContent=userListContent+"<td id='genderColumn'>"+ obj.gender +"</td>";
                            userListContent=userListContent+"<td id='userNameColumn'>"+ obj.userName +" </td>";
                            userListContent=userListContent+"<td id='userTypeColumn'> "+ obj.userType +"</td>";
                            userListContent=userListContent+"<td id='statusColumn'>"+ obj.status +"</td>";
                            userListContent=userListContent+"<td id='emailIdColumn'>"+ obj.emailId +"</td>";
                            userListContent=userListContent+"<td id='addressColumn'>"+ obj.address +"</td>";
                            userListContent=userListContent+"<td id='contactnoColumn'>"+ obj.contactNo +"</td>";
                            userListContent=userListContent+"</tr>";

                            });

                        $('#rounded-corner tbody').html(userListContent);

                        //console.log(userListContent);



                    },
                    error: function(e){


                    alert('Error: ' + e.responseText);
                    }
                    });

MVC Contrller

 @RequestMapping(value="/deleteUser",method= RequestMethod.POST)
     public @ResponseBody Map<String, Object> deleteUser(UserDetails user,HttpServletRequest request,HttpServletResponse response )throws ServletException,IOException
     {
         System.out.println("Ajax Request Received for delete User...............");
         Map<String, Object> model = new HashMap<String, Object>(); 

      JsonResponse js=new JsonResponse();
      js.setResult("pass");
      js.setStatus("active");
    // String operation=request.getParameter("operation");
     String[] selectedUserIdParameter = request.getParameterValues("select");
    System.out.println("Length:"+selectedUserIdParameter.length);
     /* Code Description:
      * Array "selectedUserIdParameter" above  has ID like {1,2,3,.....}, 
      * we need to use  array like {1 2 3 4 } without (,).so first we must convert.
      * Following code doing the same.
      * After Conversion Array  "selectedUserId" will have ID like {1 2 3 4 }
      * If You Know PHP explode()" function ,following is doing something like what explode() function does .
      */


     String msg="hello";
     List<UserDetails> usersList = userService.getAllUser();
     int no=usersList.size();
     System.out.println("Size:"+no);
     model.put("message", usersList);
     model.put("jso", js);

     return model;

 }

Answer 1:

你要接受和JSON的形式返回对象，所以在春季调度servlet的XML添加杰克逊映射豆。 杰克逊映射器没有这一切。 你不需要做手工映射或转换。

<beans:bean id="jacksonMessageChanger"  class="org.springframework.http.converter.json.MappingJacksonHttpMessageConverter">
    <beans:property name="supportedMediaTypes" value="application/json" />
</beans:bean>

<beans:bean class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter">
    <beans:property name="messageConverters">
        <util:list id="beanList">
            <beans:ref bean="jacksonMessageChanger" />
        </util:list>
    </beans:property>
</beans:bean>

现在你的控制器会是这样的：

@RequestMapping(value = "/deleteUser", method = RequestMethod.POST)
public @ResponseBody
List<UserDetails> deleteUser(@RequestBody UserDetails userDetails) {
    // fetch the userid to be deleted from the userDetails
    // remebmer the id of user to be deleted will be set in the ajax call

    userService.deleteUser(userDetails.getUserId());

    // again populate the user list to display on page
    List<UserDetails> userList = userService.getAllUser();

    return userList;
}

现在，AJAX调用会是这样的：

function deleteUser() {
    // set variables into javascript object which you need to send to spring controller
    // the variable name here should be same as it is in your java class UserDetails.java

    var user = new Object();
    user.userId = 120; // id of user to be deleted

    $.ajax({
        type : 'POST',
        url : '/${your project context path here}/deleteUser',
        dataType : 'json',
        data : JSON.stringify(user),
        contentType : 'application/json',
        success : function(data) {
           //here in data variable, you will get list of all users sent from 
           // spring controller in json format, currently its object
           // iterate it and show users on page

           showUsers(data);
        },
        error : function() {
            alert('error');
        }
    });
}

function showUsers(data) {
    // and here you show users on page
    //following code just example

    $('#allUsers').append("<option value='-1'>Select User</option>");
        for ( var i = 0, len = data.length; i < len; ++i) {
            var user = data[i];
            $('#allUsers').append("<option value=\"" + user.userId + "\">" + user.userName+ "</option>");
    }
}

这将工作。

Answer 2:

返回ArrayList中直接应该工作...

@RequestMapping(value="/deleteUser",method= RequestMethod.POST)
     public @ResponseBody ArrayList<UserDetails> deleteUser(UserDetails user,HttpServletRequest request,HttpServletResponse response )throws ServletException,IOException
     {
         System.out.println("Ajax Request Received for delete User...............");


    // String operation=request.getParameter("operation");
     String[] selectedUserIdParameter = request.getParameterValues("select");
    System.out.println("Length:"+selectedUserIdParameter.length);
     /* Code Description:
      * Array "selectedUserIdParameter" above  has ID like {1,2,3,.....}, 
      * we need to use  array like {1 2 3 4 } without (,).so first we must convert.
      * Following code doing the same.
      * After Conversion Array  "selectedUserId" will have ID like {1 2 3 4 }
      * If You Know PHP explode()" function ,following is doing something like what explode() function does .
      */


     String msg="hello";
     List<UserDetails> usersList = userService.getAllUser();
     int no=usersList.size();
     System.out.println("Size:"+no);

     return usersList;

 }

Answer 3:

这可能是太晚了，但只是向你展示如何使用jQuery的Ajax我在这里提供什么我在我的项目做了打电话到春季行动：（Ajax调用进行用户验证）

要写入* .js文件的Ajax功能：

function validateUserBeforeCreatingUser(email){ 
    var url='validateUser.htm?'&email='+email;
    $.ajax({
        url: url,
        cache: false,
        success: function(response){
            $("#errors").html(jQuery.trim(response));
            //if errors not present
            if(jQuery.trim(response)==''){
                createUser();
            }
        },
        error: function(response){
        }
    });
}

这是我在写控制器的作用 ：（我创造errors.jsp页面渲染错误）

public ModelAndView validateUser(HttpServletRequest request,
        HttpServletResponse response) throws Exception {

    /* write code to validate user, 
                 if user with specified email not found 
                      then create error 
                 else
                     keep errors page blank
            */                

    return new ModelAndView("partial", "errors", errors);
}

希望这为您提供的答案和压痕对不起，我不能做T正确:-(

文章来源: using Spring MVC and ajax to handle list of objects