我是flexigrid的新手。任何人都可以告诉我如何获取每列所选行的值。?
如何获取每个列名称(reportName和reportDescription)?因为我推送//将所有数据推送到数组中,如下所述。
我使用下面的代码来获取所选行。但它返回null。你可以帮我一下吗?
//Column. <br/>
colModel: [
{ display: 'WidgetID', name: 'WidgetID', width: 50, sortable: true, align: 'left', hide: true },
{ display: 'Widget Name', name: 'WidgetName', width: 170, sortable: true, align: 'left' },
{ display: 'IsClientReport', name: 'IsClientReport', width: 50, sortable: false, align: 'left', hide: true },
{ display: 'ClientReportID', name: 'ClientReportID', width: 50, sortable: false, align: 'left', hide: true },
{ display: 'ReportType', name: 'ReportType', width: 280, sortable: true, align: 'left' }
],
$('#grid01').click(function(event){
$('.trSelected', this).each( function(){
console.log( ' rowId: ' + $(this).attr('id').substr(3) + ' IsClientReport: ' + $('td[abbr="IsClientReport"] >div', this).html() + ' sign: ' + $('td[abbr="WidgetID"] >div', this).html() + ' ReportType: ' + $('td[abbr="ReportType"] >div', this).html() );
});
});
谢谢, Pon Kumar Pandian
答案 0 :(得分:6)
不确定你是否已经弄清楚了,但我会在这里留下这个答案,以防其他同样情况的人在我的问题上遇到问题。
在列上设置'sortable:false'会从Flexigrid生成的'td'中删除'abbr'属性。这意味着您无法使用推荐的解决方案来获取所选行。
我自己修改了flexigrid.js文件以修复此问题。
如果列具有“名称”并且具有“sortable:true”,则Flexigrid以前只添加了'abbr'属性。我删除了'sortable:true'的条件。
反过来,这也意味着列总是可以排序。 为了防止这种情况,我添加了一个'sortable'属性,只有当列是'sortable:true'时才会设置该属性
在那之后,我必须经历并找到所有使用'abbr'作为排序条件的情况,并用“可排序”检查替换它。
就是这样。
我uploaded the file to mediafire如果你只是想下载并使用这个。在非特定的地方有一些太多的变化,我在这里显示我的代码更改。如果需要,我可以提供差异或更多的解释。请注意,'sortable:true'仍适用于我的修复。
答案 1 :(得分:2)
我遇到了同样的问题,并使用以下代码
解决了这个问题 jQuery('#schoolist .trSelected').each( function(){
alert(jQuery('[abbr="name"]',this).text());
});
只需将其添加到该函数中,并将id #schoolist和abbr name替换为所需列的名称。
答案 2 :(得分:0)
请在此处查看FlexiGrid常见问题解答: http://code.google.com/p/flexigrid/wiki/FAQ#Get_selected_row
答案 3 :(得分:0)
$('#grid01').click(function(event){
$('.trSelected', this).each( function(){
console.log(
' rowId: ' + $(this).attr('id').substr(3) +
' name: ' + $('td[abbr="name"] >div', this).html() +
' sign: ' + $('td[abbr="sign"] >div', this).html() +
' status: ' + $('td[abbr="status"] >div', this).html()
);
});
});
或
将flexgrid与CI配合使用,然后在自定义按钮事件中添加以下代码
function test(com, grid) {
if (com == 'Export') {
var data = ($('.bDiv', grid).html());
$('.bDiv tbody tr', grid).each(function () {
console.log(' rowId: ' + $(this).attr('id').substr(3) + ' name: ' + $('td[abbr="name"] >div', this).html() + ' coupon_no: ' + $('td[abbr="coupon_no"] >div', this).html() + ' status: ' + $('td[abbr="status"] >div', this).html());
});
}
}
PHP CI代码:
$buttons[] = array('Export','excel','test');
检查屏幕:
答案 4 :(得分:0)
将以下函数添加到flexigrid.js源将返回所选行的数组。
$.fn.selectedRows = function (p) {
var arReturn = [];
var arRow = [];
var selector = $(this.selector + ' .trSelected');
$(selector).each(function (i, row) {
arRow = [];
$.each(row.cells, function (c, cell) {
var col = cell.abbr;
var val = cell.innerText;
var idx = cell.cellIndex;
arRow.push(
{
Column: col,
Value: val,
CellIndex: idx
}
);
});
arReturn.push(arRow);
});
return arReturn;
};
<强>用法:强>
var rows = $('#datagrid').selectedRows();
按列名查找值
function getColValueByName(cols, colName) {
var retVal = '';
var param = $.grep(cols, function (e) {
var found = e.Column == colName;
if (found != null && found != undefined & found) {
retVal = e.Value;
}
});
return retVal;
}