JSON 数据到数组答案

【问题标题】：JSON data to ArrayJSON 数据到数组
【发布时间】：2018-07-05 21:14:34
【问题描述】：

这是我从 HTML 表单获取数据的 Javascript 函数。

$(function postProduct() {
  $('#btn').click(function() {
      var productName = document.getElementById("name").value;
      var productDetail = document.getElementById("detail").value;
      var productCategory = document.getElementById("category").value;

      var dimensions = [productName, productDetail, productCategory];
      var keys = $.map(dimensions, function(value, key) {
        return value;
      });

      $.ajax({
        type: "POST",
        url: "api/product/addproduct",
        data: keys,
        success: function(result) {
          alert('successful : ' + result);
          return result;
        },
        error: function(error) {
          alert("Not Working..");
        }
      });
    }

  });
});

这是我的控制器：

[HttpPost]
[Route("api/product/addproduct")]
public IActionResult AddProduct([FromBody] string[] addproduct)
{
  var pProductName= addproduct[0];
  var pProductDetail= addproduct[1];
  var pProductCategory= addproduct[2];

  Hotel NewProduct = new Product();
  {
      NewProduct.ProductName= pProductName;
      NewProduct.ProductDetail= pProductDetail;
      NewProduct.ProductCategory= pProductCategory;
  }

  _db.Products.Add(NewProduct);
  _db.SaveChanges();

  //create a new route for post method by id
  return CreatedAtRoute(new { id = addproduct}, addproduct);
}

所以，我试图通过 AJAX 传递输入的表单并将其传递给控制器，但是，它只是失败了。

这是我用来将 json 数据转换为数组的函数：

var dimensions = [productName, productDetail, productCategory];
var keys = $.map(dimensions, function(value, key) {
  return value;
});

或者我应该重新编码我的控制器以接受 json 数据。如果是这样，请给我一个这样做的例子。抱歉，我是 web api 的新手。

更新： 这是我的 jsondata：

productName: name
productDeatil: detail
productCategory:category

这是我的数组：

keys:(7) ["name", "detail", "category"]

【问题讨论】：

你的 JSON 示例怎么样？
对 Asp.net Core 完全不熟悉，但可能是您没有在控制器中以 JSON 格式获取数据（您以 JSON 格式发送，但您从正文中读取错误方式。也许检查一下？andrewlock.net/model-binding-json-posts-in-asp-net-core

标签： javascript ajax asp.net-core-mvc

【解决方案1】：

在您的 Ajax 请求中，将数据键分配给以下值...

{ productName: document.getElementById("name").value, productDetail:  document.getElementById("detail").value, productCategory: document.getElementById("category").value }

这是一个典型的 JSON 格式的对象。

然后您还可以删除变量分配和映射函数。

最后，您需要研究如何在控制器中处理这种格式化的 JSON。

我不确定如何在 asp.net-core-mvc 中解决这个问题，但它可能就像改变一样简单

var pProductName= addproduct[0];

到

var pProductName= addproduct.productName

【讨论】：

【解决方案2】：

NewProduct 和 .ProductName 等属性之间的间距是故意的吗？

NewProduct .ProductName = pProductName;

不应该是这样吗？

Hotel NewProduct = new Product();
NewProduct.ProductName = pProductName;
NewProduct.ProductDetail = pProductDetail;
NewProduct.ProductCategory = pProductCategory;

使用简化的对象创建：

Hotel NewProduct = new Product() {
    ProductName= pProductName,
    ProductDetail= pProductDetail,
    ProductCategory= pProductCategory
};

【讨论】：

不，它只是在我复制和粘贴时发生。对此感到抱歉。
我也稍微更改了该代码...尝试删除您为 NewProduct 设置属性的位置周围的花括号。看起来您已经创建了 New Product 实例。设置属性时，代码不需要用大括号括起来。
如果我不使用花括号，它会显示一条消息（可以简化对象初始化）
Isee 可能是因为你在 new Product(); 后面有那个分号；我在简化的对象创建下更改了代码以包含括号。
谢谢它确实解决了这个问题。但是，我仍然无法将数据传递给控制器。它确实发送了一个请求，但是该值为 null。

【解决方案3】：

在ajax中添加data: JSON.stringifly(keys)解决问题。谢谢大家的帮助！

【讨论】：