通过 Jquery ajax 将 javascript 对象传递给 web 服务答案

【问题标题】：Passing javascript object to webservice via Jquery ajax通过 Jquery ajax 将 javascript 对象传递给 web 服务
【发布时间】：2010-12-31 16:58:52
【问题描述】：

我有一个返回对象的网络服务

[WebMethod]
    public List<User> ContractorApprovals()

我还有一个接受对象的网络服务

[WebMethod]
    public bool SaveContractor(Object u)

当我通过 Jquery 进行网络服务调用时：

function ServiceCall(method, parameters, onSucess, onFailure) {
    var parms = "{" + (($.isArray(parameters)) ? parameters.join(',') : parameters) + "}"; // to json
    $.ajax({
        type: "POST",
        url: "services/"+method,
        data: parms,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(msg) {
            if (typeof onSucess == 'function' || typeof onSucess == 'object')
                onSucess(msg.d);
        },
            error: function(msg, err) {
            $("#dialog-error").dialog('open');}
});

我可以调用第一个就好了。我的 onSucess 函数传递了一个结构与服务上的用户对象完全一样的 javascript 对象。

但是，我现在无法将对象返回到服务器。

我接受 Object 作为服务器端的参数，所以我无法想象那里有问题。所以我认为客户端的参数有问题，但我不确定是什么......

我正在做一些事情

ServiceCall("AuthorizationManagerWorkManagement.asmx/ContractorApprovals",
      "",
      function(data,args){$("#div").data('user',data[0])},
      null)

然后

ServiceCall("AuthorizationManagerWorkManagement.asmx/SaveContractor",
      JSON.stringify({u: $("#div").data("user")}) //dont work $("#div").data('user'), //These also do not work: "{'u': ' + $("#div").data("user") + '}", NOR JSON.stringify({u: userObject})
      function(data,args){(alert(data)},
      null)

我知道第一个服务调用有效，我可以获取数据。第二个是导致“onFailure”方法执行而不是“OnSuccess”。

有什么想法吗？

更新：

我找到了最后一个要使用的代码块：JSON.stringify({u: $("#div").data("user")})

我现在收到Invalid object passed in, member name expected. (1):

但我不知道这意味着什么……谷歌已经发现了很多这样的错误，但没有像我这样的问题……

【问题讨论】：

首先使用 FireFox 的 Firebug 插件；启用控制台选项卡，以便您可以检查每个 ajax 调用的响应，这可能是您的服务器端代码中的异常？或参数如何发送的问题？
ie 开发者工具会做吗？为 ie8 开发应用程序...我打开了调试，并运行了 ajax 调用，但调试器上没有任何反应。我必须打开一些东西吗？
好的。问题是 JSON.stringify() 返回的字符串 ebing 有一组额外的包装 {} 括号。我做了params = parms.substring(1,parms.length-1);。但是我不喜欢这个解决方案。有谁知道解决它的正确方法？我猜它与我传递给 stringify 函数的括号有关，但我不知道该怎么做......

标签： javascript jquery ajax web-services object

【解决方案1】：

parms 序列化为 json 并将 json 发送到您的服务器端方法对我来说似乎很可疑，我会对该段代码添加更多测试...

【讨论】：

【解决方案2】：

 ServiceCall("AuthorizationManagerWorkManagement.asmx/SaveContractor",
            "{u: " + JSON.stringify($("#div").data("user")) + "}",
            function(data, args) { alert(data); },
            FailedServiceCall);

【讨论】：

【解决方案3】：

好的，我已经发布了代码以及 Click here 上的链接！

    Default.aspx
        <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs"   Inherits="_Default" %>             
<!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>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
    <script type="text/javascript">
        var url = '<%=ResolveUrl("~/WebService.asmx/HelloWorld")%>';
        $(document).ready(function() {
           $('#txtAutoSuggest').keyup(function() {
                var str = $("#txtAutoSuggest").val();
                var a = JSON.stringify({ name: str });
                CallService(a);
                  });

        });

     function CallService(a) {
        $.ajax({
            type: "POST",
           url: url,
           data: a,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
           success: function(data, status) {
                $('#lblResult').text(data.d);
            },
            error: Error
        });
    }
    function Error(request, status, error) {
        $('#lblResult').text("Not Matched");
    }
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="txtAutoSuggest" runat="server"></asp:TextBox>
        <asp:Label ID="lblResult" Text="&nbsp;" Width="100%" runat="server" />
    </div>
</form>
</body>
</html>

或

应用程序.js

 var url = '<%=ResolveUrl("~/WebService.asmx/HelloWorld")%>';
        $(document).ready(function() {
            $('#txtAutoSuggest').keyup(function() {
                var str = $("#txtAutoSuggest").val();
                var a = JSON.stringify({ name: str });
                CallService(a);
            });

        });

    function CallService(a) {
        $.ajax({
            type: "POST",
            url: url,
            data: a,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(data, status) {
                $('#lblResult').text(data.d);
            },
            error: Error
        });
    }
    function Error(request, status, error) {
        $('#lblResult').text("Not Matched");
    }




<%@ WebService Language="C#" Class="WebService" %>
using System;
using System.Data;
using System.Data.SqlClient;
using System.Configuration;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
using System.Collections;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;




 [WebService(Namespace = "http://tempuri.org/")]
 [WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]

// 允许从脚本调用此 Web 服务，使用 ASP.NET AJAX 或 JQuery。

[System.Web.Script.Services.ScriptService]
 public class WebService  : System.Web.Services.WebService {

    [WebMethod]
    public string HelloWorld(string name)
    {
        Utility ut = new Utility();  // some class where you will have your database connection
        ArrayList suggestedProblemName = ut.getItems(name);  // some method of the class
        return ""+suggestedProblemName[0];
    } 
}

【讨论】：