ASP MVC 3 使用 AJAX 和 JQUERY 提交 url 参数答案

【问题标题】：ASP MVC 3 submit url parameters using AJAX and JQUERYASP MVC 3 使用 AJAX 和 JQUERY 提交 url 参数
【发布时间】：2012-09-16 15:10:09
【问题描述】：

我在使用 ASP.NET MVC3、AJAX 和 JQUERY 时遇到问题。我有以下功能

[HttpPost]
public bool Update(int id, FormCollection collection)

这是我的 jQuery 源代码：

$(document).ready(function () {
    $('#btnUpdate').click(function (e) {
        // Cancel default action
        e.preventDefault();
        var formCollection = $('#formId').serialize();
        $.ajax({
            cache: false,
            type: 'POST',
            url: '@Url.Action("Action","Controller")',
            data: { id: $('#id').val(), collection: formCollection },
            success: function (data) {
                alert(data);
            },
            error: function (xhr, ajaxOptions, thrownError) {
                alert('Error during process: \n' + xhr.responseText);
            }
        });
    });
});

id参数提交成功，但是集合（FormCollection）包含一个数组，{[0]:10000,[1]:collection}。我无法解决问题。当我像这样重新设计解决方案时：

[HttpPost]
public bool Update(FormCollection collection)

$(document).ready(function () {
    $('#btnUpdate').click(function (e) {
        // Cancel default action
        e.preventDefault();
        $.ajax({
            cache: false,
            type: 'POST',
            url: '@Url.Action("Action", "Controller")',
            data: $('#formId').serialize(),
            success: function (data) {
                alert(data);
            },
            error: function (xhr, ajaxOptions, thrownError) {
                alert('Error during process: \n' + xhr.responseText);
            }
        });
    });
});

一切正常。我在传递 2 参数时做错了什么？

谢谢！！！

【问题讨论】：

这种方式不会得到FormCollection 你已经通过了模型类的集合定义在这里。喜欢public bool Update(int id, userProfile collection)
确保在 IE 中检查这个Is JSON.stringify() supported by IE 8?

标签： asp.net-mvc jquery

【解决方案1】：

尝试在您的 JSON 上调用 JSON.stringify()：

data: JSON.stringify({ id: $('#id').val(), collection: formCollection })

【讨论】：

【解决方案2】：

$(document).ready(function () {
    $('#btnUpdate').click(function (e) {
        // Cancel default action
        e.preventDefault();
        var formCollection = $('#formId').serialize();
        $.ajax({
            cache: false,
            type: 'POST',
            url: '@Url.Action("Action","Controller")',
            data: JSON.stringify({ id: $('#id').val(), collection: formCollection }),
            success: function (data) {
                alert(data);
            },
            error: function (xhr, ajaxOptions, thrownError) {
                alert('Error during process: \n' + xhr.responseText);
            }
        });
    });
});

你应该用 jsonstringify 传递数据

【讨论】：

创建以下错误：参数字典包含不可为空类型“System.Int32”的空条目“id”...
这意味着您还必须查看您的 id 字段
或将 [HttpPost] public bool Update(int id, FormCollection collection) 改为 [HttpPost] public bool Update(int? id, FormCollection collection)
id 不应该是可选参数！ jquery 和 ajax 必须提交唯一的 id 和表单集合...
您是否通过警报检查了您在 id 中获得的内容

【解决方案3】：

这是真正的手表：

参数 ID 提交成功（Name=id, Wert=10000）。在 id 上方，您可以看到 formCollection，包括 ajax 调用的 FORM.serialize() 值。但是 System.Web.Mvc.FormCollection 只包含两个键：id 和 collection！我期待

“姓名”
“地址”
“地址_2”
...

我想如果在创建我的 ajax 请求时出错，但我不知道为什么......

var customerNo = $('#fieldID').val();
var formCollection = $('#formID').serialize();
$.ajax({
    cache: false,
    type: 'POST',
    url: '@Url.Action("Action", "Controller")',
    data: { id: customerNo, collection: formCollection },
    dataType: 'json',
    success: function (data) {
        if (data) {
            alert(data);
        };
    },
    error: function (xhr, ajaxOptions, thrownError) {
        alert('Error during process: \n' + xhr.responseText);
    }
});

以下行产生错误：

data: JSON.stringify({ id: customerNo, collection: formCollection })

参数字典包含一个不可为空类型“System.Int32”的空条目“id”...

更改无效：

data: { id: customerNo, collection: JSON.stringify(formCollection) },

有什么想法吗？

【讨论】：

【解决方案4】：

这是我的想法（有效！）

在模型的部分类中添加字符串属性，在“数据”中手动添加此属性。

JS：

$.ajax({
        cache: false,
        type: 'POST',
        url: '@Url.Action("Action", "Controller")',
        data: $("form").serialize() + "&id=whatever",
        dataType: 'json',
        success: function (data) {
                if (data) {
                        alert(data);
                };
        },
        error: function (xhr, ajaxOptions, thrownError) {
                alert('Error during process: \n' + xhr.responseText);
        }
});

partialClass.cs 模型：

public partial class TableName
{
    public string id { get; set; }
}

控制器：

[HttpPost]
public bool Update(FormCollection collection){
    var ID = collection.id; 
}

问候！

【讨论】：