2017-07-06 43 views
1

当用户单击保存按钮时,JavaScript函数使用AJAX调用Controller并通过有关对象的JSON数据发送。ajax控制器中的空参数

JavaScript函数

$.ajax({ 
     url: "/Data/sendFridgeItems?items=" + JSON.stringify($scope.items.data), 
     type: "POST", 
     data: JSON.stringify($scope.items.data), 
     dataType: "json", 
     contentType: "application/json; charset=utf-8", 
     success: function() { 
      console.log("good!"); 
     }, 
     error: function() { 
      console.log("error"); 
     } 
    }); 

控制器

[HttpPost] 
    public ActionResult SendFridgeItems(string items) 
    { 
     fridge[] fridgeItems = JsonConvert.DeserializeObject<fridge[]>(items); 
     foreach (fridge item in fridgeItems) 
     { 
      bool exists = cookDB.fridges.AsEnumerable() 
       .Any(x => x.Name == item.Name && x.Purchased == item.Purchased && x.Count == item.Count); 
      if (!exists) 
      { 
       cookDB.fridges.Add(item); 
       cookDB.SaveChangesAsync(); 
      } 
     } 
     return null; 
    } 

它的工作原理,但我不认为通过URL参数发送我的数据的方式是在我的情况是正确的,因为数据将足够大。我想知道是否有更好的方式将我的数据发送到控制器?

我试图用这种方式发送它,但控制器收到空值。

$.ajax({ 
     url: "/Data/sendFridgeItems", 
     type: "POST", 
     data: JSON.stringify($scope.items.data), 
     dataType: "json", 
     contentType: "application/json; charset=utf-8", 
     success: function() { 
      console.log("good!"); 
     }, 
     error: function() { 
      console.log("error"); 
     } 
    }); 

JSON $ scope.items.data

[{"id":2,"name":"Item1","count":2,"type":"pcs.","purchased":"12/09/2017","wasted":"15/10/2017","cam":"Freezer","comment":"no comment","$$hashKey":"object:38"},{"id":3,"name":"Item2","count":30,"type":"g.","purchased":"15/01/1880","wasted":"21/03/1882","cam":"Cooler","comment":"commented","$$hashKey":"object:39"}] 

$ scope.items

$scope.items = { 
    "count": 2, 
    "data": [ 
     { 
      "name": "Item1", 
      "count": 2, 
      "type": "pcs.", 
      "purchased": "12/09/2017", 
      "wasted": "15/10/2017", 
      "cam": "Freezer", 
      "comment": "no comment" 
     }, 
    { 
      "name": "Item2", 
      "count": 30, 
      "type": "g.", 
      "purchased": "15/01/1880", 
      "wasted": "21/03/1882", 
      "cam": "Cooler", 
      "comment": "Commented" 
     } 
    ] 
}; 

固定控制器对于N.Ivanov的溶液(该控制器+ N的伊万诺夫的阿贾克斯=解决方案)

public ActionResult SendFridgeItems(fridge[] items) 
    { 
     fridge[] fridgeItems = JsonConvert.DeserializeObject<fridge[]>(items.ToString()); 
     foreach (fridge item in items) 
     { 
      bool exists = cookDB.fridges.AsEnumerable() 
       .Any(x => x.Name == item.Name && x.Purchased == item.Purchased && x.Count == item.Count); 
      if (!exists) 
      { 
       cookDB.fridges.Add(item); 
       cookDB.SaveChangesAsync(); 
      } 
     } 
     return null; 
    } 
+0

使它像这样,让我知道'数据:{“项目”:JSON.stringify($ scope.items.data) },' –

回答

1

ajax中的data字段需要一个Object,你给它一个字符串。试着只提供你的对象,假设$scope.items.data是一个对象。如果你更多的了解$scope变量的信息,那么我可以给你一个更好的答案。

代码:

$.ajax({ url: "/Data/sendFridgeItems", type: "POST", d̶a̶t̶a̶:̶ ̶$̶s̶c̶o̶p̶e̶.̶i̶t̶e̶m̶s̶.̶d̶a̶t̶a̶,̶ dataType: "json", contentType: "application/json; charset=utf-8", success: function() { console.log("good!"); }, error: function() { console.log("error"); } });

希望这有助于!


编辑:您提供后

进一步检查的$scope.items.data内容使我注意到$scope.items.data是对象的数组。所以,为了让AJAX工作和实际提供有效的JSON,试试下面的代码: $.ajax({ url: "/Data/sendFridgeItems", type: "POST", data: { "items": $scope.items.data }, dataType: "json", contentType: "application/json; charset=utf-8", success: function() { console.log("good!"); }, error: function() { console.log("error"); } });

我已验证{ "item": $scope.items.data }是一个有效的JSON通过JSONLint

希望这能解决您的问题!

+0

你也可以像这样尝试:'data:{item:JSON.stringify($ scope.items。数据)},'希望这有助于! “ –

+1

”data:$ scope.items.data“fires”JSON primitive:Item1“无效。和数据:{item:JSON.stringify($ scope.items.data)}会触发“无效的JSON基元:item”。像数据引用:{“item”:JSON.stringify($ scope.items.data)}引发同样的错误。变量与函数具有相同的范围。以JSON格式添加my $ scope.items.data的数据以提问 – Ryu

+0

@Ryu我已更新我的答案,检查*编辑*,希望它能解决问题! –

0

尝试JSON解析解析数据对象,并将其发送到控制器

$.ajax({ 
    url: "/Data/sendFridgeItems", 
    type: "POST", 
    data: JSON.parse($scope.items.data), 
    dataType: "json", 
    contentType: "application/json; charset=utf-8", 
    success: function() { 
     console.log("good!"); 
    }, 
    error: function() { 
     console.log("error"); 
    } 
});