ajax - 发布时无效的 JSON 原语

Question

我知道这个问题已经在 Stakoverflow 中被问过多次。但是没有一个解决方案对我有帮助。谁能告诉我做错了什么

我有一个 Controller Action 如下

<HttpPost()>
    Function WFUserEdited(ByVal userdetails As userdetails) As ActionResult
            Return View()
    End Function

我的 Viewmodel 如下所示

Public Class userdetails
    Public Property Username As String
    Public Property Password As String
    Public Property Fullname As String
    Public Property Location As String
    Public Property Appcode As String
    Public Property Userlevel As String
End Class

我的 Jquery Ajax 调用如下所示

 $("#btnSubmit").click(function () {
                var q = validate();
                if (q = true) {
                    var userdetails = {};
                    userdetails.UserName = $('#txtusername').val().toString();
                    userdetails.Password = $('#txtPassword').val().toString();
                    userdetails.Fullname = $('#txtfullName').val().toString();
                    userdetails.Location = $('#txt_location').val().toString();
                    userdetails.Appcode = $("#drp_appcode").chosen().val().toString();
                    userdetails.Userlevel = $("#drp_userlevel").chosen().val().toString();
                    userdetails = JSON.stringify(userdetails);
                    var url = '@Url.Action("WFUserEdited", "WFUser")';

                    $.ajax({
                        url: url,
                        type: 'POST',
                        traditional: false,
                        contentType: "application/json; charset=utf-8",
                        dataType: 'json',
                        data: { "userdetails": userdetails },
                        success: function (data) {
                        },
                        error: function (data) {
                        }
                    });
                }
            });
        });

在 Beginexecutecore 我得到以下异常

 Protected Overrides Function BeginExecuteCore(callback As AsyncCallback, state As Object) As IAsyncResult
        Try
            ViewBag.UserImage = "http://_layouts/15/CaptarisWFTasksWebPart/EmployeeImages/sree.jpg"

        Catch generatedExceptionName As Exception
            Return MyBase.BeginExecuteCore(callback, state)
        End Try
        Return MyBase.BeginExecuteCore(callback, state)
    End Function

System.Web.Mvc.dll 中出现“System.ArgumentException”类型的异常，但未在用户代码中处理
附加信息:无效的 JSON 原语:userdetails。

Answer 1

当您指定 contentType: "application/json ，您必须将您发送为 JSON 的数据字符串化。在您的情况下，数据是 javascript 对象`(其中包含一些字符串化数据)，而不是 JSON。

由于userdetails已经字符串化(使用 JSON.stringify() )，然后将 ajax 代码更改为

$.ajax({
    url: url,
    type: 'POST',
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    data: userdetails,
    success: function (data) {
        ...
});

但是，无需将其作为 JSON 发送。您可以使用默认的 'application/x-www-form-urlencoded; charset=UTF-8'
删除 userdetails = JSON.stringify(userdetails);一行代码，然后它只是

$.ajax({
    url: url,
    type: 'POST',
    dataType: 'json',
    data: userdetails,
    success: function (data) {
        ...
});

请注意，在这两种情况下，您都可以省略 traditional: false选项。

如果您使用 HtmlHelper 正确生成了表单控件，方法绑定(bind)到你的模型属性，那么你不需要手动创建 object .您可以简单地使用 .serialize() .此外，您应该处理表单提交事件，而不是按钮单击事件，并检查 .valid()

$('form').submit(function(e) {
    e.preventDefault();
    if (!$(this).valid()) {
        return;
    }
    var userdetails = $(this).serialize();
    var url = '@Url.Action("WFUserEdited", "WFUser")';
    $.ajax({
        url: url,
        type: 'POST',
        dataType: 'json',
        data: userdetails,
        success: function (data) {
            ...
    });
});