EasyUI Forum
July 02, 2024, 12:05:18 PM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News:
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: how to get column header data when rowspan > 1  (Read 13884 times)
rannacher
Jr. Member
**
Posts: 52


View Profile
« 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.
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #1 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);
Logged
rannacher
Jr. Member
**
Posts: 52


View Profile
« Reply #2 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?
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #3 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.
Logged
rannacher
Jr. Member
**
Posts: 52


View Profile
« Reply #4 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
Logged
rannacher
Jr. Member
**
Posts: 52


View Profile
« Reply #5 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!
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #6 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},
...
]
]
Logged
rannacher
Jr. Member
**
Posts: 52


View Profile
« Reply #7 on: February 26, 2016, 09:14:30 AM »

God stworthy Wink
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!
Logged
stworthy
Administrator
Hero Member
*****
Posts: 3581


View Profile Email
« Reply #8 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');
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines Valid XHTML 1.0! Valid CSS!