提交表单 ajax，在控制器中接收空值

Question

我正在使用 ajax 向 spring 控制器提交表单，但是当它到达我的控制器时我得到一个空模型，我在这里添加我的代码：

  

<script>
$(document).ready(function() {
 $('#partsForm').submit(
  function(event) {
var str = $("#partsForm").serialize();
$.ajax({
 type : "POST",
 url : $("#partsForm").attr("action"),
 data : str,
 dataType: "json",
 contentType: "application/json"
});

return false;
  });
 });
</script>

<form:form id="partsForm" method="post" modelAttribute="modelpartsForm" class="form-horizontal" role="form"  action="${pageContext.request.contextPath}/jsp/search/productConfig.html">
  <div class="form-group">
  <table class="table table-hover" width="50%" align="right">
    <thead>
      <tr>
      <th></th>
        <th>Part number</th>
        <th>Price</th>
        <th>Stock</th>
        <th>Qty</th>
      </tr>
    </thead>
    <tbody>
      <c:if test="${!empty partsForm.prodls}">
      <c:forEach items="${partsForm.prodls}" var="prodsByCat">
      <tr>
      <td></td>
       <td>${prodsByCat.partNumber} ${prodsByCat.description}</td>
       <td>${prodsByCat.price}</td> 
       <td>${prodsByCat.quantity}</td> 
      <td>
      <input type="NUMBER" MIN="0" MAX=${prodsByCat.quantity} STEP="2" VALUE="0" SIZE="3">
      </td>
 </tr>
      </c:forEach> 
       <tr>
      <td colspan="5">
      <button type="submit" class="btn btn-info">add parts</button>
      </td>
 </tr>
      </c:if>
    </tbody>
  </table>
  </div>
</form:form>

这是我的控制器

 @RequestMapping(value="/productConfig",method = RequestMethod.POST)
 @ResponseBody
 public ModelAndView currentquote(@ModelAttribute("partsForm") PartsFormDTO partsForm) {
   ModelAndView modelView = new ModelAndView();
....do some logic
   return modelView;
 }

调试时我只得到一个空的 partsForm，我应该更改我的 ajax 调用吗？谢谢！

Answer 1

这是在模型中传递属性的方式：

假设您要为页面加载 page/request，该页面具有 URL：http://localhost:8080/carApp/add

现在，为了将其与模型中的属性相关联，您应该有一个知道接受对上述 URL 的请求的控制器。这意味着您应该有一个带有下一个的控制器：@RequestMapping(value="/add")

现在，我可以在其中创建一个新对象并将其作为属性绑定到模型。像这样：

@RequestMapping(value="/add",method=RequestMethod.GET)
public String addCar(Model model){

    model.addAttribute("car", new Car());

    return "car_add";
}

这只是尝试将数据绑定到该汽车属性的准备工作。

在上面，您可以看到每当我 GET 请求 /add 路由时，我都会将一个新的 Car 对象附加到模型，您可以使用它JSP 文件中的汽车对象，借助表达式语言 以便将数据绑定到它。

现在，假设您填写了 JSP 表单，目的是将数据绑定到 JSP 文件中的 Car 属性。

当您 POST 向控制器请求该表单时，您将能够在控制器内的另一个方法上使用 @ModelAttribute 并实际执行该绑定。像这样：

@RequestMapping(value="/add", method=RequestMethod.POST)
public String saveCar(@ModelAttribute Car car){
    /*** some manipulation on car object ***/
    System.out.println("saving car");
    return "car_add";
}

那个 POST 请求将到达 saveCar 方法，并会尝试将 GET 请求中的原始空属性值绑定到带有 POST 请求的 car 参数，然后将数据放入其中你的 JSP.

Answer 2

我发现了问题所在，忘记了 post 之前的答案，我实际上并没有提交模型，因为我在该模型中有一个产品列表，我使用 varStatus="status" 并将它们传递到表单中，我像传递隐藏值一样传递它们，

   <input type="hidden" name="prodls[${status.index}].partNumber" value="${prodsByCat.partNumber}"/>
      <input type="hidden" name="prodls[${status.index}].price" value="${prodsByCat.price}"/>

所以这是第一个错误，在那之后我进入了我的模型，但我没有刷新我想更新的 DIV，而是将我重定向到页面视图，所以我不得不修改我的ajax 打电话，像这样：

$(document).ready(function() {
 $('#partsForm').submit(
  function(event) {
   var partsForm = "${partsForm}";

var str = $("#partsForm").serialize();
$.ajax({
 url : $("#partsForm").attr("action"),
 data : str,
 type : "POST",
 success : function(response) {
  $("#prodConfig").html(response);
 },
 error : function(xhr, status, error) {
  alert("ERROR:"+xhr.responseText);
 } 
});

之后它进入我的控制器并仅刷新我需要的DIV

提交表单 ajax，在控制器中接收空值

submit form ajax, receive null value in controller

ajax

null

spring

form-submit