Print Page - how to get column header data when rowspan

Title: how to get column header data when rowspan > 1
Post by: rannacher on February 22, 2016, 12:45:55 PM

I use datagrid and rowspan to group columns.
Now I have 2 lines of header as with rowspan = 2
All columns are created dynamically and I need to access the column header data now...

All functions I use when one header line like below dont work for second line.

var opts = $('#dg').datagrid('getColumnFields');
var col = $('#dg').datagrid('getColumnOption', column);

PLEASE HELP!
BR Mike.

Title: Re: how to get column header data when rowspan > 1
Post by: stworthy on February 22, 2016, 05:04:09 PM

The 'getColumnFields' method returns an array that contains all the column fields. To get a special column option, please try this:

Code:

var field = ...
var col = $('#dg').datagrid('getColumnOption', field);
console.log(col);

Title: Re: how to get column header data when rowspan > 1
Post by: rannacher on February 23, 2016, 05:02:15 AM

Dear stworthy

fully understood.
But if I use rowspan > 1 hence creating f.e. TWO lines of column headers I can only access data in one line.
getColumnOption array seems horizontal but what about the other header line?

Any idea?

Title: Re: how to get column header data when rowspan > 1
Post by: stworthy on February 23, 2016, 07:33:18 AM

The fields can only be defined in horizontal layout. If your issue continues, please show an example to demonstrate your issue.

Title: Re: how to get column header data when rowspan > 1
Post by: rannacher on February 23, 2016, 01:52:45 PM

tried uploading a small JPG 100K to illustrate the column header iin 2 rows

QUOTE
The upload folder is full. Please try a smaller file and/or contact an administrator.
UNQUOTE

Title: Re: how to get column header data when rowspan > 1
Post by: rannacher on February 24, 2016, 11:50:51 AM

Please see the attachment.
Thx in advance!

PS: have to say its a beautiful peace of library!

Title: Re: how to get column header data when rowspan > 1
Post by: stworthy on February 24, 2016, 05:22:15 PM

Your 'Typ' and 'Datum' columns should have the 'rowspan' set to 2.

Code:

columns:[
	[
		{field:'typ',title:'Typ',width:50,rowspan:2},
		{field:'datum',title:'Datum',width:100,rowspan:2},
		{title:'Auftrag',colspan:2},
		...
	],
	[
		{field:'design',title:'ARCH-Design',width:100},
		{field:'ep',title:'ARCH-EP',width:100},
		...
	]
]

Title: Re: how to get column header data when rowspan > 1
Post by: rannacher on February 26, 2016, 09:14:30 AM

God stworthy ;)
They both are set to rowspan 2 - it is perfectly easyui and looks well - see JPG attached.
But when I want to access the column header data now - 2 lines fully dyn created -
all functions I know like below dont work for both lines.

var opts = $('#dg').datagrid('getColumnFields');
var col = $('#dg').datagrid('getColumnOption', column);

f.e. I want to access "Auftrag" AND "ARCH-Design" in 3rd column.
or basically all header elements in header line1 and all in line 2.
I hope I could explain what I mean.

PLEASE HELP!

Title: Re: how to get column header data when rowspan > 1
Post by: stworthy on February 26, 2016, 07:53:35 PM

Please try to download the patch from http://www.jeasyui.com/download/downloads/jquery-easyui-1.4.4-patch.zip.
When defining columns, you can assign a 'id' property that allows you access that header cell.

Code:

columns:[
	[
		{id:'c1',field:'typ',title:'Typ',width:50,rowspan:2},
		{id:'c2',field:'datum',title:'Datum',width:100,rowspan:2},
		{id:'c3',title:'Auftrag',colspan:2},
		...
	],
	[
		{field:'design',title:'ARCH-Design',width:100},
		{field:'ep',title:'ARCH-EP',width:100},
		...
	]
]

To get the 'Auftrag' header cell, please try this code:

Code:

var td = $('#c3');
var cell = td.children('.datagrid-cell');

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: rannacher on February 22, 2016, 12:45:55 PM