使用jQuery将JSON对象成功发送到asp.net WebMethod

时间:2009-07-17 23:20:23

标签: asp.net javascript jquery ajax json

我已经为此工作了3个小时并放弃了。 我只是尝试使用jQuery将数据发送到asp.net Web方法。 数据基本上是一堆键/值对。所以我试图创建一个数组并将对添加到该数组。

我的WebMethod(aspx.cs)看起来像这样(这可能是我在javascript中构建的错误,我只是不知道):

   [WebMethod]
    public static string SaveRecord(List<object> items)
    .....

以下是我的示例javascript:

  

var items = new Array;

    var data1 = { compId: "1", formId: "531" };
    var data2 = { compId: "2", formId: "77" };
    var data3 = { compId: "3", formId: "99" };
    var data4 = { status: "2", statusId: "8" };
    var data5 = { name: "Value", value: "myValue" };

    items[0] = data1;
    items[1] = data2;
    items[2] = data3;
    items[3] = data4;
    items[4] = data5;
Here is my jQuery ajax call:

var options = {
        error: function(msg) {
            alert(msg.d);
        },
        type: "POST",
        url: "PackageList.aspx/SaveRecord",
        data: { 'items': items },
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        async: false,
        success: function(response) {
            var results = response.d;
        }
    };
    jQuery.ajax(options);

我收到错误 - Invalid JSON primitive: items. -

所以...如果我这样做:

  

var DTO = {'items':items};

并设置数据参数如下:

  

数据:JSON.stringify(DTO)

然后我收到此错误:

Cannot convert object of type \u0027System.String\u0027 to type \u0027System.Collections.Generic.List`1[System.Object]\u0027

6 个答案:

答案 0 :(得分:46)

在您的示例中,如果您的数据参数为:

,它应该有效
data: "{'items':" + JSON.stringify(items) + "}"

请记住,您需要将一个JSON字符串发送到ASP.NET AJAX。如果您将实际的JSON对象指定为jQuery的数据参数,它会将其序列化为&amp; k = v?k = v对。

看起来你已经阅读了它,但再看一下我的example of using a JavaScript DTO with jQuery, JSON.stringify, and ASP.NET AJAX。它涵盖了使这项工作所需的一切。

注意:您绝不应该使用JavaScriptSerializer在“ScriptService”中手动反序列化JSON(如其他人所建议的)。它会根据您方法的指定参数类型自动为您执行此操作。如果你发现自己这样做了,那你做错了。

答案 1 :(得分:9)

当使用AJAX.NET时,我总是使输入参数只是一个普通的旧对象,然后使用javascript反序列化器将其转换为我想要的任何类型。至少可以通过这种方式调试并查看Web方法所接收的对象类型。

使用jQuery时需要将对象转换为字符串

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="sm" runat="server" EnablePageMethods="true">
            <Scripts>
                <asp:ScriptReference Path="~/js/jquery.js" />
            </Scripts>
        </asp:ScriptManager>
        <div></div>
    </form>
</body>
</html>
<script type="text/javascript" language="javascript">
    var items = [{ compId: "1", formId: "531" },
        { compId: "2", formId: "77" },
        { compId: "3", formId: "99" },
        { status: "2", statusId: "8" },
        { name: "Value", value: "myValue"}];

        //Using Ajax.Net Method
        PageMethods.SubmitItems(items,
            function(response) { var results = response.d; },
            function(msg) { alert(msg.d) },
            null);

        //using jQuery ajax Method
        var options = { error: function(msg) { alert(msg.d); },
                        type: "POST", url: "WebForm1.aspx/SubmitItems",
                        data: {"items":items.toString()}, // array to string fixes it *
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        async: false, 
                        success: function(response) { var results = response.d; } }; 
        jQuery.ajax(options);
</script>

代码背后

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Web.Script.Serialization;
using System.Web.Script.Services;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace CustomEquip
{
    [ScriptService]
    public partial class WebForm1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }
        [WebMethod]
        public static void SubmitItems(object items)
        {
            //break point here
            List<object> lstItems = new JavaScriptSerializer().ConvertToType<List<object>>(items);
        }
    }
}

答案 2 :(得分:5)

以下是我们项目的代码片段 - 我没有将对象包装为字符串以及Date值 - 希望这有助于某人:

        // our JSON data has to be a STRING - need to send a JSON string to ASP.NET AJAX. 
        // if we specify an actual JSON object as jQuery's data parameter, it will serialize it as ?k=v&k=v pairs instead
        // we must also wrap the object we are sending with the name of the parameter on the server side – in this case, "invoiceLine"
        var jsonString = "{\"invoiceLine\":" + JSON.stringify(selectedInvoiceLine) + "}";

        // reformat the Date values so they are deserialized properly by ASP.NET JSON Deserializer            
        jsonString = jsonString.replace(/\/Date\((-?[0-9]+)\)\//g, "\\/Date($1)\\/");

        $.ajax({
            type: "POST",
            url: "InvoiceDetails.aspx/SaveInvoiceLineItem",
            data: jsonString,
            contentType: "application/json; charset=utf-8",
            dataType: "json"
        });

服务器方法签名如下所示:

    [WebMethod]
    public static void SaveInvoiceLineItem(InvoiceLineBO invoiceLine)
    {

答案 3 :(得分:3)

用另一个属性装饰你的[WebMethod]:

[ScriptMethod(ResponseFormat = ResponseFormat.Json)]

我相信这是在System.Web.Services.Scripting ...

答案 4 :(得分:1)

答案 5 :(得分:1)

这是您定义数据的方式(JSON)

data: { 'items': items },

这就是它应该的方式

data: '{ items: " '+items +' "}',

基本上你是在序列化参数。