This is a migrated thread and some comments may be shown as answers.

determining TH data('field') when table contains hidden columns to the left of clicked on cell

2 Answers 164 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Tim R
Top achievements
Rank 1
Tim R asked on 01 Feb 2013, 12:18 PM
I am going to be displaying data in "pivoted" mode in the grid, and the TH data-field will contain an id from the database; for example:

Date..............Mary...............Fred...............Mike  
1/1/2013........17.....................19...................22

for "Mike" col-header it might be data-field="145998452".

Is there any built-in function in the Kendo library that returns the TH data-field for the column of a clicked-on cell, taking into account hidden columns to the left? If there are invisible columns to the left of the clicked-on cell,  the index/cellindex are off by the invisible columns count (to the left of the clicked cell). 

EDIT: This is a byproduct of the Kendo design that puts the header and the table-body each into separate tables, and the table-body-table doesn't contain the columns if they're marked hidden (display:none) in the header-table.   Kendo header-table has style="display:none" when the grid column's configuration has hidden:true

<th role="columnheader" data-field="eeid" style="display: none;" class="k-header" data-role="sortable"><a class="k-link" href="#" style="">eeid</a></th>



  $(grid.tbody).on('click',"> tr:not(.k-grouping-row, .k-detail-row, .k-group-footer)", function(e){
var cell =  e.target;
 
    var dataInfo = $('thead th').eq(e.target.cellIndex).data('field');
        var ix = $(cell).index(),
         thData = $('thead th').eq(ix).attr('data-field');

2 Answers, 1 is accepted

Sort by
0
Richard
Top achievements
Rank 1
answered on 01 Feb 2013, 06:38 PM
You might be able to use this (not tested)

given td in content table

index = $.inArray(td,$(td).parent().children(":visible");
hdr = $(td).closest('.k-grid .k-grid-header table');
th = hdr.find('th:eq('+index+')');

0
Dimo
Telerik team
answered on 05 Feb 2013, 11:22 AM
Hello Tim,

I tested that script you have provided and it works as expected in all major browsers, when using the latest Kendo UI version and hiding some columns. Please make sure that you are not making any other customizations or changes to the Grid HTML output, which may interfere with the cell index detection.

Regards,
Dimo
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
Grid
Asked by
Tim R
Top achievements
Rank 1
Answers by
Richard
Top achievements
Rank 1
Dimo
Telerik team
Share this question
or