easyui DataGrid 的 Checkbox 选择多行

这么一来在取得 DataGrid 的 Checkbox 有勾选的数据值就可以沿用方式一的程序，

view source print ?

1. $('#ButonGetCheck').click(function(){

2. var checkedItems = $('#dg').datagrid('getChecked');

3. var names = [];

4. $.each(checkedItems, function(index, item){

5. names.push(item.productname);

6. });               

7. console.log(names.join(","));

8. });

执行结果：
 

 

完整 Javascript 程序如下：

 

view source print ?

01. $(function(){

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

03. title: 'CheckBox Selection on DataGrid',

04. url: 'datagrid_data3.json',

05. width: '700',

06. rownumbers: true,

07. columns:[[

08. {field:'checked',formatter:function(value,row,index){

09. if(row.checked){

10. return '<input type="checkbox" name="DataGridCheckbox" checked="checked">';

11. }

12. else{

13. return '<input type="checkbox" name="DataGridCheckbox">';

14. }

15. }},

16. { field: 'productid', title: 'productid' },

17. { field: 'productname', title: 'productname' },

18. { field: 'unitcost', title: 'unitcost' },

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

20. { field: 'listprice', title: 'listprice' },

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

22. ]],

23. singleSelect: true

24. });

25.  

26. $('#ButonGetCheck').click(function(){

27. var checkedItems = $('#dg').datagrid('getChecked');

28. var names = [];

29. $.each(checkedItems, function(index, item){

30. names.push(item.productname);

31. });               

32. console.log(names.join(","));

33. });

34. });

35.  

36. $.extend($.fn.datagrid.methods, {

37. getChecked: function (jq) {

38. var rr = [];

39. var rows = jq.datagrid('getRows');

40. jq.datagrid('getPanel').find('div.datagrid-cell input:checked').each(function () {

41. var index = $(this).parents('tr:first').attr('datagrid-row-index');

42. rr.push(rows[index]);

43. });

44. return rr;

45. }

46. });

转载于:https://www.cnblogs.com/handsome1013/p/5437601.html