splitAt introduces extra header height!

Suite and Optimus Suite 5
#1

I have dhtmlxGrid with two headers (the second header is filled with filters)
However, when I use splitAt() function I noticed that the first and second header become bigger height. I inspected the HTML with the browser’s debugger and saw that the style height is populated with some random numbers like 38px and 42px.

I really don’t need this extra height and i believe there is absolutely no reason this function to change the height of the header.

Any solution?

#2

Such issue may occur if your have multiline content in some of your column headers.
The only solution is to us the simbgle line content in this case.

#3

I have only #text_filter and #select_filter on the second row

#4

I’m experiencing the same problem, in Chrome. I have a grid with multi-line(2) text header. The grid looks and performs nicely in IE. But in Chrome, the height of the first row of the header is abnormally big.

One more interesting observation is that besides this two-row header, the grid has a third row of header which contains filters. And there is a button that shows/hides the filter row. In IE, this feature works without problem. In Chrome, the height of the header rows grows with every click of this button.

#5

Could you please, provide a complete demo or a demo link, where the problem can be reconstructed locally.

#6

Hello,

I modified one of your grid sample files. You can see the problem by loading the file. Do remember to change the path of dhtmlx.css, dhtmlx.js and image in this file to their correct locations in your setup.

Thanks

test_grid_split.html (2.5 KB)

#7

This is the known problem and is related to the incorrect header height calculation due to the rowspan.
As a workaround a can suggest you to add a fictive column before all the columns of your grid to force the correct header calculation.
Something like:

myGrid.setHeader("temp,Sales,Book Title,Author,Price,In Store,Shipping,Bestseller,Date of Publication");
myGrid.attachHeader("temp,#rspan,#rspan,SubHeader1,#rspan,#rspan,#SubHeader3,#rspan,#rspan");
myGrid.setInitWidths("0,80,150,120,80,80,80,80,100");

In this case the header height will be correct and won’t inmcrease during the colukmn resize.
test_grid_split.html (2.6 KB)

#8

Thank you so much for providing the workaround. It does work when grid’s headers are set by javascript API. Unfortunately, it doesn’t seem to work in the case when grid headers are passed in xml. Please find in the attachment a modified grid example demonstrating the issue. Thank you.

test_treegrid_split.html (1.1 KB)
treegrid_sample_07_split.xml (2.5 KB)

#9

Please, try to attach your header in the beforeInit section of the xml:

  <beforeInit>
  <call command="attachHeader">
  <param>temp,#rspan,subheader1,subheader2</param>
  </call>
  </beforeInit>

instead of the afterInit

#10

It still doesn’t work after I changed it to ‘beforeInit’.