無法讓JQGrid顯示數據（來自JSON服務）

我有一個概念驗證的JQGrid，我一直在玩，但我無法讓它顯示來自返回JSON的web服務的數據。我知道這是正確地打我的服務，因爲我可以設置一個斷點，並看着它在頁面加載時受到打擊。無法讓JQGrid顯示數據（來自JSON服務）

網格呈現，看起來不錯，但沒有數據顯示在其中。我對電網的代碼如下所示（我嘗試刪除所有的複雜性，我可以）：

jQuery("#list4").jqGrid({ 
     url: 'http://localhost:55555/GetJson', 
     datatype: "json", 
     colNames: ['-First Name-', '-LastName-'], 
     colModel: [ 
     { name: 'fname', index: 'fname', width: 50},   
     { name: 'lname', index: 'lname', width: 50} 
    ], 
     caption: "Employees",  
     pager: "#pager2", 
     viewrecords: true, 
     width: 550 
    });  
jQuery("#list4").jqGrid('navGrid','#pager2',{edit:false,add:false,del:false})

我的服務返回以下JSON（請注意，我添加換行符以提高可讀性）：

{"total":5,"page":1,"records":5,"rows":[ 
{"id":1,"cell":["Andrew","Smith"]}, 
{"id":2,"cell":["Danny","Johnson"]}, 
{"id":3,"cell":["Ron","Lewis"]}, 
{"id":4,"cell":["George","Washington"]}, 
{"id":5,"cell":["Peter","Davis"]}]}

就像我說的，網格似乎渲染正常，當我嘗試用JS直接填充數組時，它填充得很好，但它不會讀取我的JSON。有任何想法嗎？

這是我在閱讀Oleg的文章並複製他的示例後在本地嘗試的HTML：它仍未顯示任何數據。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Just simple local grid</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/themes/redmond/jquery-ui.css" /> 
    <link rel="stylesheet" type="text/css" href="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-3.8.2/css/ui.jqgrid.css" /> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> 
    <script type="text/javascript" src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-3.8.2/js/i18n/grid.locale-en.js"></script> 
    <script type="text/javascript" src="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-3.8.2/js/jquery.jqGrid.min.js"></script> 
    <script type="text/javascript"> 
    //<![CDATA[ 
     $(document).ready(function() { 
      jQuery("#list4").jqGrid({ 
       url: 'repdetec.json', 
       datatype: "json", 
       colNames: ['-First Name-', '-LastName-'], 
       colModel: [ 
        { name: 'fname', index: 'fname', width: 50}, 
        { name: 'lname', index: 'lname', width: 50} 
       ], 
       caption: "Employees", 
       pager: "#pager2", 
       viewrecords: true, 
       width: 550 
      }); 
      jQuery("#list4").jqGrid('navGrid','#pager2',{edit:false,add:false,del:false}) 
     }); 
    //]]> 
    </script> 
</head> 
<body> 
    <table id="list4"><tr><td/></tr></table> 
    <div id="pager2"></div> 
</body> 
</html

來源

2011-04-09 RepDetec

如何看到here您的代碼可以處理數據。我懷疑從服務器返回的數據要麼沒有與您發佈的數據完全相同，要麼服務器響應的內容類型錯誤爲。我建議您檢查服務器響應Fiddler的Firebug。

如果您使用Microsoft ASMX Web服務old answer可能可以幫助您。如果您在EF上使用ASP.NET MVC，請查看here。

來源

2011-04-09 22:52:52 Oleg

我查看了你的樣品，它看起來不錯。我在本地拉下了html，並將URL更改爲您正在託管JSON的URL，並且當我將它拉到本地時，它仍然顯示一個空格！我正在使用的標記如上所示。 – RepDetec 2011-04-09 23:42:29

@RepDetec：你只能從同一個網站**獲得每個Ajax的數據**。請參閱[相同來源政策]（http://en.wikipedia.org/wiki/Same_origin_policy）。您應該在本地** ** HTML和AJAX文件。它在那裏放置在相同的目錄中，或者在它將工作的URL中使用**相對路徑**。 – Oleg 2011-04-10 06:02:29

好的，所以我下載了json，並將其保存爲repdetec.json與html文件完全相同的目錄。當我在本地打開HTML時，它仍然沒有顯示數據。我已經更新了上面的HTML，以反映我的具體情況。它仍然顯示一個空的網格。 – RepDetec 2011-04-10 19:22:05

無法讓JQGrid顯示數據（來自JSON服務）

回答

相關問題