無法獲取jQuery Ajax來解析JSON webservice結果

Question

我已驗證來自C＃Webmethod的JSON響應，所以我不認爲這是問題所在。

我試圖解析結果使用簡單的jQuery $ .ajax，但無論出於何種原因，我無法得到該方法正確地觸發和解析結果，也偶然似乎無法得到函數來觸發結果。他們對可以返回的JSON對象的大小有任何限制。

我也從一個「的Site.Master」頁面中刪除了此代碼，因爲它總是會刷新時，我打了簡單的按鈕。標籤是否正確地使用jQuery元素，比如我從DOM抓取的按鈕輸入？

function ajax() { 
//var myData = { qtype: "ProductName", query: "xbox" }; 
var myData = { "request": { qtype: "ProductName", query: "xbox"} }; 
$.ajax({ 
    type: "POST", 
    url: "/webservice/WebService.asmx/updateProductsList", 
    data: {InputData:$.toJSON(myData)}, 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function (msg) { 
     // var msg = {__type: "Testportal.outputData", id: "li1234", message: "it's work!", myInt:101} 
     alert("message=" + msg.d.ProductName + ", id=" + msg.d.Brand); 
    }, 
    error: function (res, status) { 
     if (status === "error") { 
      // errorMessage can be an object with 3 string properties: ExceptionType, Message and StackTrace 
      var errorMessage = $.parseJSON(res.responseText); 
      alert(errorMessage.Message); 
     } 
    } 
}); 

}

和頁面：

<asp:Button ID="Button1" runat="server" OnClientClick="ajax();" Text="Button" /> 

而且Serverside集團WEBMETHOD：

public class WebService : System.Web.Services.WebService 
{ 
    [WebMethod] 
    [ScriptMethod(UseHttpGet = true, ResponseFormat = ResponseFormat.Json)] 
    public OutputData updateProductsList(InputData request) 
    { 
     OutputData result = new OutputData(); 
     var db = new App_Data.eCostDataContext(); 
     var q = from c in db.eCosts 
       select c; 

     if (!string.IsNullOrEmpty(request.qtype) && !string.IsNullOrEmpty(request.query)) 
     { 
      q = q.Like(request.qtype, request.query); 
     } 

     //q = q.Skip((page - 1) * rp).Take(rp); 
     result.products = q.ToList(); 

     searchObject search = new searchObject(); 

     foreach (App_Data.eCost product in result.products) 
     { 
      /* create new item list */ 
      searchResult elements = new searchResult() 
      { 
       id = product.ProductID, 
       elements = GetPropertyList(product) 
      }; 
      search.items.Add(elements); 
     } 
     return result; 

    } 

和輔助類：

public class OutputData 
{ 
    public string id { get; set; } 
    public List<App_Data.eCost> products { get; set; } 

} 
public class InputData 
{ 
    public string qtype { get; set; } 
    public string query { get; set; } 
} 

Answer 1

的一個問題是，你沒有做任何事情來阻止提交表單，並在同一時間執行完全回發/重裝你開始你的$。阿賈克斯（）回調的按鈕。

我建議佈線這件事悄悄地而不是使用OnClientClick屬性，像這樣：

$(document).ready(function() { 
    // May need to use $('<%= Button1.ClientID %>') if your Button is 
    // inside a naming container, such as a master page. 
    $('#Button1').click(function(evt) { 
    // This stops the form submission. 
    evt.preventDefault(); 

    $.ajax({ 
     // Your $.ajax() code here. 
    }); 
    }); 
}); 

我也奧列格同意，你應該使用json2.js爲您的JSON字符串化和解析。在較新的瀏覽器中，這將回退到瀏覽器的這些方法的本地實現，這會更快並且使分析更安全。

更新：

爲了回答您的有關數據，不，這看起來不正確的問題。

要最終發送到服務器這是什麼（沒有格式化）：

{"request":{"gtype":"ProductName","query":"xbox"}} 

爲了實現這個目標，你想是這樣的：

var req = { request : { qtype: "ProductName", query: "xbox" }}; 

$.ajax({ 
    data: JSON.stringify(req), 
    // Remaining $.ajax() parameters 
}); 

記住request， qtype和query必須與您的服務器端結構匹配，並區分大小寫。

您也可以在定義請求對象（我喜歡，就個人而言，讓事情變得清晰可讀）更詳細：

var req = { }; 

req.request = { }; 

req.request.qtype = "ProductName"; 
req.request.query = "xbox"; 

我寫了一個多一點關於這個在這裏，如果你'重新感興趣：http://encosia.com/2009/04/07/using-complex-types-to-make-calling-services-less-complex/

Answer 2

你的服務器端代碼方法是什麼樣的？設置一箇中斷點。它被擊中了嗎？

它應該是這個樣子：

[WebMethod, ScriptMethod] 
public string updateProductsList(string qtype, string query) 
{ // stuff 
} 

而且，你的JavaScript數據PARAMS看起來不正確格式化。

Answer 3

在我看來，你的問題是你嘗試使用手動JSON序列化。有更直接的方法。您應該聲明[ScriptMethod (ResponseFormat = ResponseFormat.Json)]或[ScriptMethod (UseHttpGet = true, ResponseFormat = ResponseFormat.Json)]，並直接返回對象而不是web方法中的字符串。在客戶端（在JavaScript）我嚴格推薦您使用JSON.stringify（從中可以從http://www.json.org/js.html下載json2.js）爲jQuery.ajax的data參數的構建。

看看Can I return JSON from an .asmx Web Service if the ContentType is not JSON?和How do I build a JSON object to send to an AJAX WebService?也可能在JQuery ajax call to httpget webmethod (c#) not working你有更多的實驗興趣。你可能有