Search code examples
xhtmlrichfacesscrollbar

Horizontal scroll in rich:panel to default right to left

I have a rich:panel with a style="overflow: scroll" tag inside. By default, the scroll slides left to right. I am constantly adding a new dataTable to a dataGrid with the click of a button and I want the user to always see the most recent one, and since I have it set up so that each dataTable is added as a column to the dataGrid, the most recent one will always be on the right side of the dataGrid. Is there a way I can default the scroll to go right to left? Or maybe creating the columns from right to left?

Here is the code for my panel:

<rich:panel id="PREV" rendered="#{yieldSearch.update}" style = "overflow: scroll">
            <rich:dataGrid id="PT" value="#{yieldSearch.storeYieldTest}"
                    var="_yield" columns="#{yieldSearch.columns}">


            </rich:dataGrid>
            </rich:panel>

and here is my button:

<h:commandButton id="NXT" value="Add New Store" rendered="#{yieldSearch.update}" action="#     {yieldSearch.newStore()}" >
Solution

  • It is little bit difficult to answer because you haven't provided any code sample.
    However I think you can use javascript for this. I assume your panel structure is as below. 

    <rich:panel id="myPnl"........>
    <rich:dataGrid id="myGrid".............>
      .........
    </rich:dataGrid>
</rich:panel>

    And I assume you add dataTables in to the dataGrid by clicking a <a4j:commandButton> and calling an action. If so add an oncomplete event to the <a4j:commandButton> as below.

    <a4j:commandButton value="Add new data table" reRender="myPnl" oncomplete="#{rich:element('myPnl')}.scrollLeft += #{rich:element('myGrid')}.offsetWidth;"/>