您不應該從WebMethods返回GridView。您應該返回數據並使用jQuery將其綁定到客戶端。
如果您希望完全替換GridView,我建議您使用某種jQuery插件以表格方式顯示數據。你可以看看jQGrid或datatables(我最喜歡的)。你的web方法只能返回Json格式的數據。喜歡的東西:
[WebMethod]
public List<CustomObject> GetData(string param1, string param2)
{
//return data here
}
在數據表的特定情況下,有an interface,你一定要堅持。它看起來像這樣在我的C#版本:
public class ResponseData
{
#region properties
public int iTotalRecords { get; set; } //used by datatables to build the pager
public int iTotalDisplayRecords { get; set; } //used by datatables to build the pager
public string sEcho { get; set; }
public string sColumns { get;set; } //optional
public List<CustomObject> aaData { get; set; } //your actual business objects
#endregion
}
所以你的網站的方法,如果您選擇使用數據表,應該返回ResponseData
[WebMethod]
public ResponseData GetData(string param1, string param2)
{
//return ResponseData
}
你會綁定在客戶端的數據做東西像這樣:
$(document).ready(function() {
var oTableSummary = $("#tbl").dataTable({
"bJQueryUI": true,
"bPaginate": false,
"sPaginationType": "full_numbers",
"bServerSide": true,
"bProcessing": true,
"iDisplayLength": 50,
"bFilter": false,
"bSortClasses": false,
"bDeferRender": false,
"oLanguage": { "sSearch": "Search all columns:" },
"aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
"sAjaxSource": "WebService.asmx/GetData",
"fnServerData": function(sSource, aoData, fnCallback) {
$.ajax({
"type": "POST",
"dataType": 'json',
"contentType": "application/json; charset=utf-8",
"url": sSource,
"data": "{'param1': 'param1" , 'param2': 'param2' }",
"success": function(result) {
fnCallback(result); // draw the table
}
});
}
});
});
PS:你將需要花費相當多的學習這些東西,但如果你掌握了它,你不會想回到使用服務器控件。 :D
我不認爲jquery意味着你認爲它的意思。具體來說,你的網格示例將很容易實現使用jQuery模板。 – R0MANARMY