Resizing <rich: scrollableDataTable> rows

[dpranker]

Hi,

I'm working on a site using the richfaces scrollabledatatable, and I was wondering if there is an easy way to make the rows resizable similar to how the columns can be changed.  I have tried looking around but no simple solution seems readily available, so I would appreciate any help.

[ilya_shaikovsky]

no out of the box solution.. and for now can't see custom ones also.

[dpranker]

Hmm well thanks for looking, if there is no simple solution to do this dynamically is there any way to simply make the rows have more lines? It appears the rowspan attribute does not work for the scrollableDataTable

[nbelaevski]

Hi Dennis,

Please try this CSS: http://community.jboss.org/message/53179#53179 to control row height.

[maynard]

specifically - if you want to specify it for one special component instance, then the following code in theme.css is sufficient:

#MyFormID_MyScrollableDataTableID .rich-sdt-column-cell {
   height: 50px;

}

where MyFormID and MyScrollableDataTableId are id's for the respective components. Without #MyFormID_MyScrollableDataTableID, the redefined style will apply to every sdt in application.

And question - is there way how to add rich:panel or any other more than one component in cell. My experience is that cell displays only some middle part of panel. Games with padding and margins gives nothing. It would be nice to add panel to cell - this can be substitute for lacking the column groups.

[dpranker]

Thank you for that suggestion, it is close to what I'm looking for, unfortunately, if text is multiple lines, even with an expanded row it cuts off the second line, I've attached a screenshot to show what I mean.

[maynard]

I am interested too in resolving this issues. There is no chance to use ExtendedDataTable, because it lacks horizontal scroll and while there are some workarounds how to add this horizontal scroll, it does not works sucesfullully: 1) any CSS (e.g. like

extdt-content{

   overflow-x:auto;

   overflow-y:auto;

   position:absolute;

}

) make the last row partially invisible (I guess there can be workaround too - make EDT nonsortable and add extra last fake row) and 2) there is no way how to freeze some first columns.

So - I am left with ScrollableDataTable. I made investigation that there is the following code in ScrollableDataTableBaseRenderer.java:

writer.writeText("#" + getNormalizedId(context, state.getGrid())+ " .rich-sdt-c-" + cell_index + " {", "width");

                                    writer.writeText("width: " + width + "px;", "width");

                                    writer.writeText("}", "width");

And this code can be resposible for rendering the column cell. cell_index is integer type, so - the CSS class for each individual cell is simply .rich-sdt-c-9999. But the strange thing is that - if I am save the HTML code (e.g. from Firefox view page source), then I cann't find the respective HTML code for this table - e.g. searc for rich-sdt-c gives nothing. Also - if I write the specifice value in the table cell - e.g. 88888, then this literal '88888' cann't be found in HTML code either. I see that there is some big JavaScript function that is doing something.

So - redefining rich-sdt-c-... in theme.css (with margins, padding, border width and so on) and actually - redefining CSS column cell styles etc. gives nothing to correct the height of the cell, althoug - redefinitaion (of column cell style) can work for font style and so on.

So - is there suggestion how to proceed?

[nbelaevski]

Maynard,

Define your own CSS classes via component attributes (e.g. columnClasses and do customization via them).

[dpranker]

Could you explain what you mean? I'm somewhat new to this and I feel so close to fixing this, I just need the column to display more than 1.5 or so lines of text (even when the actual row is resized)