从表单提交传递复杂数据

本文关键字：复杂 数据 表单提交 | 更新日期: 2023-09-27 18:33:08

我有一个对象数组，每个对象都有 5 个字段，我想在表单提交时发送该数组。但是我一直为空，不确定我做错了什么。

<form method="post" ....>
<table>
<!-- ko foreach: items-->
<tr>
   <td>
      <span data-bind="text: Category"></span>
      <input type="hidden" data-bind="value:ko.toJSON($data)" />
   </td>
</tr>
<!-- /ko -->
</table>
</form>

 [HttpPost]
 public void MyItems(List<Item> data)
 {
 }

Item 与 javascript 对象的 JSON 匹配。

如何将项目数组获取到 C# 调用？

从表单提交传递复杂数据

您可以在 javascript 中将列表项序列化为字符串作为参数，并在操作 mvc 中对其进行反序列化。

<form method="post" ....>
<table>
<!-- ko foreach: items-->
<tr>
   <td>
      <span data-bind="text: Category"></span>
      <input type="hidden" value="ko.toJSON($data)" />
   </td>
</tr>
<!-- /ko -->
</table>
</form>

控制器 

 [HttpPost]
 public void MyItems(string data)
 {
    JavaScriptSerializer parser = new JavaScriptSerializer();
    var info = parser.Deserialize<List<Item>>(data);
 }
您必须将 JSON

数组的提交包装在像"items"这样的变量中，变量名称匹配很重要。 ASP.NET 会自动将 JSON 反序列化到您的对象中，无需手动操作。我已经对此进行了全面测试并经常这样做，因此我知道它有效。

[HttpPost]
// Note how the argument name is "items"
 public ActionResult MyItems(List<Item> items)
 {
     // set a breakpoint and check the items List
     return Content("success")
 }
public class Item
{
// Make sure to use public properties get/set
    public string Category {get;set;}
}

还有你的JavaScript

function Item()
{
    this.Category = ko.observable();
}
function ViewModel()
{
    this.Items = ko.observableArray();
    this.submit = function() {
        // note how we make sure argument name matches "items" as in Controller
        var myData = ko.toJSON(  { items: this.Items() });
        $.ajax({
            url: '/Home/MyItems',
            contentType: 'application/json',
            type: 'POST',
            data: myData,
            success: function(data){
                // check result
            }
        })
    }
}
var vm = new ViewModel();
ko.applyBindings(vm);
var item1 = new Item();
item1.Category("Cat1");
vm.Items.push(item1);
vm.submit();

问题是您正在发布一个 html 表单而不是 JSON ，您将需要进入原始表单发布数据以取出您的JSON字符串。通常这是用Request.Form ？看起来您缺少的是隐藏标签上的name属性。一旦你把它放到位，它应该像这样简单：

<input type="hidden" name="MyHiddenElement" data-bind="value:ko.toJSON($data)" />
string json = Request.Form["MyHiddenElement"];

同样可能有帮助的一件事是，如果您扔下许多隐藏标签并赋予它们相同的名称，则可以执行给定名称的 Request.Form，您将获得一个逗号分隔的<Input隐藏值数组列表。这对于复杂的数据发布方案非常有用。

<input type='hidden' name="MyHiddenElement" value="1" />
<input type='hidden' name="MyHiddenElement" value="2" />
<input type='hidden' name="MyHiddenElement" value="3" />
string csvList = Request.Form["MyHiddenElement"];
相关文章：