您的位置:首页 > Web前端 > JQuery

jQuery EasyUI DataGrid Checkbox 数据设定与取值

2013-11-05 19:06 435 查看
转:http://www.it165.net/pro/html/201305/6000.html

这一篇将会说明两种使用jQueryEasyUIDataGrid的Checkbox设定方式,以及在既有数据下将checked为true的该笔数据列的Checkbox设定为Checked,另外就是两种Checkbox设定方式下如何取得有勾选的数据。

使用的范例JSON数据:

01.
{

02.
"total"
:4,

03.
"rows"
:[

04.
{

05.
"productid"
:
"FI-SW-01"
,

06.
"productname"
:
"Koi"
,

07.
"unitcost"
:10.00,

08.
"status"
:
"P"
,

09.
"listprice"
:36.50,

10.
"attr1"
:
"Large"
,

11.
"itemid"
:
"EST-1"
,

12.
"checked"
:
true

13.
},

14.
{

15.
"productid"
:
"K9-DL-01"
,

16.
"productname"
:
"Dalmation"
,

17.
"unitcost"
:12.00,

18.
"status"
:
"P"
,

19.
"listprice"
:18.50,

20.
"attr1"
:
"SpottedAdultFemale"
,

21.
"itemid"
:
"EST-10"
,

22.
"checked"
:
true

23.
},

24.
{

25.
"productid"
:
"RP-SN-01"
,

26.
"productname"
:
"Rattlesnake"
,

27.
"unitcost"
:12.00,

28.
"status"
:
"P"
,

29.
"listprice"
:38.50,

30.
"attr1"
:
"Venomless"
,

31.
"itemid"
:
"EST-11"
,

32.
"checked"
:
true

33.
},

34.
{

35.
"productid"
:
"RP-SN-01"
,

36.
"productname"
:
"Rattlesnake"
,

37.
"unitcost"
:12.00,

38.
"status"
:
"P"
,

39.
"listprice"
:26.50,

40.
"attr1"
:
"Rattleless"
,

41.
"itemid"
:
"EST-12"
,

42.
"checked"
:
false

43.
}

44.
]

45.
}


设定方式一:使用预设的设定方式网页的HTML原始码内容

方式一的完整Javascript程序:

01.
$(
'#dg'
).datagrid({

02.
title:
'CheckBoxSelectiononDataGrid'
,

03.
url:
'datagrid_data3.json'
,

04.
width:
'700'
,

05.
rownumbers:
true
,

06.
columns:[[

07.
{field:
'ck'
,checkbox:
true
},

08.
{field:
'productid'
,title:

'productid'
},

09.
{field:
'productname'
,title:

'productname'
},

10.
{field:
'unitcost'
,title:

'unitcost'
},

11.
{field:
'status'
,title:
'status'
},

12.
{field:
'listprice'
,title:

'listprice'
},

13.
{field:
'itemid'
,title:
'itemid'
}

14.
]],

15.
singleSelect:
false
,

16.
selectOnCheck:
true
,

17.
checkOnSelect:
true
,
onLoadSuccess:function(data){

if(data){

$.each(data.rows,function(index,item){

if(item.checked){

$('#dg').datagrid('selectRow',parseInt(item.id-1));

}

});

}

}

});


注:datagridMethod:

selectRowindexSelectarow,therowindexstartwith0.
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: