JQuery的Datagrid是通過(guò)Ajax實(shí)現(xiàn)異步加載數(shù)據(jù)。在實(shí)際應(yīng)用中，我們經(jīng)常需要使用Datagrid來(lái)顯示數(shù)據(jù)，Ajax可以幫助我們?cè)诓凰⑿马?yè)面的情況下更新數(shù)據(jù)。

下面我們來(lái)看一段實(shí)現(xiàn)Datagrid的Ajax代碼：

$(function(){
$('#datagrid').datagrid({   //綁定datagrid
url: 'data.php',   //數(shù)據(jù)來(lái)源
queryParams: {page:1, rows:10},   //參數(shù)
pagination:true,   //顯示分頁(yè)
singleSelect:true,   //單選
idField:'id',   //主鍵
columns:[[   //顯示的列
{field:'id',title:'ID',width:80},
{field:'name',title:'Name',width:120},
{field:'age',title:'Age',width:80,align:'right'},
{field:'gender',title:'Gender',width:80,align:'right'}
]]
});
});

上面代碼中我們首先綁定了一個(gè)Datagrid，然后指定了數(shù)據(jù)的來(lái)源（即data.php）。我們也可以通過(guò)queryParams來(lái)設(shè)置參數(shù)（例如頁(yè)面和行數(shù)），將其傳遞到服務(wù)器端。

接下來(lái)我們還設(shè)置了一些選項(xiàng)，例如分頁(yè)、單選和主鍵。最后，通過(guò)columns參數(shù)指定了我們要顯示哪些列。

這樣，我們就可以用這個(gè)代碼實(shí)現(xiàn)一個(gè)基本的Datagrid。當(dāng)用戶執(zhí)行操作時(shí)，我們只需要通過(guò)Ajax將最新的數(shù)據(jù)從服務(wù)器獲取，然后更新Datagrid即可。