我使用jqxwidgets网格（jqxgrid）作为radiobutton的渲染器列，并通过rowdata值检查true或false，当选中多个无线电和滚动网格时，取消选中已选中的单选按钮（更改状态）。
cellsrenderer:function(,,rowdata){
var radio = '<input type="radio" ' + rowdata.HasPermission?"checked":"" + '/>';
return radio;
}
修改 请运行下面的片段并chekedd许多收音机然后滚动网格，你看到未经检查的旧收音机检查。
$(function() {
//permission = > 1:read 2:write 3:read/write
var data = [
{id:1,rolename:"role1",permission:1}, {id:2,rolename:"role2"},
{id:3,rolename:"role3"},
{id:4,rolename:"role4",permission:2},
{id:5,rolename:"role5",permission:1}, {id:6,rolename:"role6"},
{id:7,rolename:"role7"}, {id:8,rolename:"role8"},
{id:9,rolename:"role9"}, {id:10,rolename:"role10"},
{id:11,rolename:"role11"}, {id:12,rolename:"role12"},
{id:13,rolename:"role13"}, {id:14,rolename:"role14"}, {id:15,rolename:"role15"}, {id:16,rolename:"role16"},
{id:17,rolename:"role17"}, {id:18,rolename:"role18"},
{id:19,rolename:"role19"}, {id:20,rolename:"role20"},
{id:21,rolename:"role21"}, {id:22,rolename:"role22"},
{id:23,rolename:"role23"}, {id:24,rolename:"role24"},
{id:25,rolename:"role25"}, {id:26,rolename:"role26"},
{id:27,rolename:"role27"}, {id:28,rolename:"role28"},
{id:29,rolename:"role29"}, {id:30,rolename:"role30"},
{id:31,rolename:"role31"}, {id:32,rolename:"role32"},
{id:33,rolename:"role33"}, {id:34,rolename:"role34"},
{id:35,rolename:"role35"}, {id:36,rolename:"role36"},
{id:37,rolename:"role37"}, {id:38,rolename:"role38"},
{id:39,rolename:"role39"}, {id:40,rolename:"role40"}
];
// prepare the data
var source =
{
datatype: "array",
datafields: [
{ name: 'id', type: 'number' },
{ name: 'rolename', type: 'string' },
{ name: 'permission', type: 'number' }
],
id: 'id',
localdata:data
};
var dataAdapter = new $.jqx.dataAdapter(source);
// initialize jqxGrid
$("#grid").jqxGrid(
{
width: "100%",
height:400,
source: dataAdapter,
pageable: false,
autoheight: false,
sortable: false,
altrows: true,
enabletooltips: true,
editable: false,
selectionmode: 'multiplecellsadvanced',
columns: [
{ datafield: 'id', hidden:true },
{ datafield: 'permission', hidden:true },
{ text: 'Role Name', datafield: 'rolename', width: 250 },
{text:'Read',width:50,cellsrenderer:function (row, columnfield, value, defaulthtml, columnproperties, rowdata) {
var radio = "<input type='radio' name='"+rowdata.id+"'/>";
return radio;
}},
{text:'Write',width:50,cellsrenderer:function (row, columnfield, value, defaulthtml, columnproperties, rowdata) {
var radio = "<input type='radio' name='"+rowdata.id+"'/>";
return radio;
}},
{text:'Read/Write',width:50,cellsrenderer:function (row, columnfield, value, defaulthtml, columnproperties, rowdata) {
var radio = "<input type='radio' name='"+rowdata.id+"'/>";
return radio;
}}
]
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link href="https://jqwidgets.com/public/jqwidgets/styles/jqx.base.css" rel="stylesheet"/>
<script src="https://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<div id="grid"></div>
答案 0 :(得分：0)
我找到了解决问题的方法。坦克。
function get_product_listing_count()
{
global $wp_query;
// Define each variable again (before using it)
$paged = max( 1, $wp_query->get( 'paged' ) );
$per_page = $wp_query->get( 'posts_per_page' );
$total = $wp_query->found_posts;
$result= '';
if ( $total <= $per_page || -1 === $per_page ) {
if ($total == 1){$result = "Showing all $total results";}else{$result = "Showing 1 result";}
}
else
{
$first = ( $per_page * $paged ) - $per_page + 1;
$last = min( $total, $wp_query->get( 'posts_per_page' ) * $paged );
$result = "Showing $first – $last of $total results";
}
return $result;
}//end function
var data = [];
$(function() {
debugger
//permission = > 1:read 2:write 3:read/write
data = [
{id:1,rolename:"role1",permission:1}, {id:2,rolename:"role2"},
{id:3,rolename:"role3"},
{id:4,rolename:"role4",permission:2},
{id:5,rolename:"role5",permission:1}, {id:6,rolename:"role6"},
{id:7,rolename:"role7"}, {id:8,rolename:"role8"},
{id:9,rolename:"role9"}, {id:10,rolename:"role10"},
{id:11,rolename:"role11"}, {id:12,rolename:"role12"},
{id:13,rolename:"role13"}, {id:14,rolename:"role14"}, {id:15,rolename:"role15"}, {id:16,rolename:"role16"},
{id:17,rolename:"role17"}, {id:18,rolename:"role18"},
{id:19,rolename:"role19"}, {id:20,rolename:"role20"},
{id:21,rolename:"role21"}, {id:22,rolename:"role22"},
{id:23,rolename:"role23"}, {id:24,rolename:"role24"},
{id:25,rolename:"role25"}, {id:26,rolename:"role26"},
{id:27,rolename:"role27"}, {id:28,rolename:"role28"},
{id:29,rolename:"role29"}, {id:30,rolename:"role30"},
{id:31,rolename:"role31"}, {id:32,rolename:"role32"},
{id:33,rolename:"role33"}, {id:34,rolename:"role34"},
{id:35,rolename:"role35"}, {id:36,rolename:"role36"},
{id:37,rolename:"role37"}, {id:38,rolename:"role38"},
{id:39,rolename:"role39"}, {id:40,rolename:"role40"}
];
// prepare the data
var source =
{
datatype: "array",
datafields: [
{ name: 'id', type: 'number' },
{ name: 'rolename', type: 'string' },
{ name: 'permission', type: 'number' }
],
id: 'id',
localdata:data
};
var dataAdapter = new $.jqx.dataAdapter(source);
// initialize jqxGrid
$("#grid").jqxGrid(
{
width: "100%",
height:400,
source: dataAdapter,
pageable: false,
autoheight: false,
sortable: false,
altrows: true,
enabletooltips: true,
editable: false,
selectionmode: 'multiplecellsadvanced',
columns: [
{ datafield: 'id', hidden:true },
{ datafield: 'permission', hidden:true },
{ text: 'Role Name', datafield: 'rolename', width: 250 },
{text:'Read',width:50,cellsrenderer:function (row, columnfield, value, defaulthtml, columnproperties, rowdata) {
var checked = rowdata.permission == 1?"checked":"";
var radio = "<input type='radio' name='"+rowdata.id+"' onclick='checkedX(this);' value='1' " +checked+ "/>";
return radio;
}},
{text:'Write',width:50,cellsrenderer:function (row, columnfield, value, defaulthtml, columnproperties, rowdata) {
var checked = rowdata.permission == 2?"checked":"";
var radio = "<input type='radio' name='"+rowdata.id+"' onclick='checkedX(this);' value='2' " +checked+ "/>";
return radio;
}},
{text:'Read/Write',width:50,cellsrenderer:function (row, columnfield, value, defaulthtml, columnproperties, rowdata) {
var checked = rowdata.permission == 3?"checked":"";
var radio = "<input type='radio' name='"+rowdata.id+"' onclick='checkedX(this);' value='3' " +checked+ "/>";
return radio;
}}
]
});
});
function checkedX(element){
debugger
var $this = $(element);
var roleid = $this.attr("name");
var filteredData = data.filter(function(item){
return item.id == roleid * 1;
});
if(filteredData && filteredData.length>0){
var item = filteredData[0];
item.permission = $this.val()*1;
}
$("#grid").jqxGrid('updatebounddata');
}