4 Replies Latest reply on Jul 14, 2009 7:53 AM by David Bolsover

    Sorting example scrollableDataTable

    David Bolsover Newbie

      I'm in need of help with sorting a scrollableDataTable; can anyone point me to a working example (JSP and backing bean).

      I've done a search (honest!) but can only find incomplete examples - either just the JSP or JSP + seemingly unrelated Java code. There are nice examples on the exadel site but these don't include the java code.

      The main problem I have is how to implement sorting in response to a user click on a header.

      Thanks, David

        • 2. Re: Sorting example scrollableDataTable
          David Bolsover Newbie

          Hi Nick
          Thanks for this - actually, I had already looked at these sources but could not make much sense of them...
          Just to be sure, I copied all the code to my own environment and ran the cars page..
          There are problems..
          Sorting on columns 1 and 2 seems to be completely broken.
          Sorting on remaining columns appears to work.
          Selecting a line popsup data for different line.

          Files copied over were DataTableScrollerBean, DemoInventoryItem and Facet.

          I'm sure I have copied the code correctly.

          • 3. Re: Sorting example scrollableDataTable
            Ilya Shaikovsky Master

            which RF version? Many issues of SDT component were fixed before 3.3.1GA so I highly recommend it.

            Also provide page code if it not copied but just yours.

            • 4. Re: Sorting example scrollableDataTable
              David Bolsover Newbie

              Hi Ilya
              RF is version 3.3.1.
              Code is exactly same as source files I mentioned - just in different package to suit my test environment.
              The Page is JSP rather than facets..

              <%@page contentType="text/html" pageEncoding="UTF-8"%>
              <%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
              <%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
              <%@taglib prefix="a4j" uri="http://richfaces.org/a4j" %>
              <%@taglib prefix="rich" uri="http://richfaces.org/rich" %>
              <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
              <style type="text/css">
               <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
               <link rel="stylesheet" type="text/css" href="../yosemite.css">
               <rich:spacer height="30" />
               <rich:scrollableDataTable rowKeyVar="rkv" frozenColCount="1" height="400px"
               width="700px" id="carList" rows="40" columnClasses="col"
               value="#{dataTableScrollerBean.allCars}" var="category" sortMode="single"
               <rich:column id="make">
               <f:facet name="header"><h:outputText styleClass="headerText" value="Make" /></f:facet>
               <h:outputText value="#{category.make}" />
               <rich:column id="model">
               <f:facet name="header"><h:outputText styleClass="headerText" value="Model" /></f:facet>
               <h:outputText value="#{category.model}" />
               <rich:column id="price">
               <f:facet name="header"><h:outputText styleClass="headerText" value="Price" /></f:facet>
               <h:outputText value="#{category.price}" />
               <rich:column id="mileage">
               <f:facet name="header"><h:outputText styleClass="headerText" value="Mileage" /></f:facet>
               <h:outputText value="#{category.mileage}" />
               <rich:column width="200px" id="vin">
               <f:facet name="header"><h:outputText styleClass="headerText" value="VIN" /></f:facet>
               <h:outputText value="#{category.vin}" />
               <rich:column id="stock">
               <f:facet name="header"><h:outputText styleClass="headerText" value="Stock" /></f:facet>
               <h:outputText value="#{category.stock}" />
               <rich:spacer height="20px"/>
               <a4j:commandButton value="Show Current Selection" reRender="table"
               <rich:modalPanel id="panel" autosized="false" keepVisualState="false" width="315" height="230">
               <f:facet name="header">
               <h:outputText value="Selected Rows"/>
               <f:facet name="controls">
               <span style="cursor:pointer" onclick="javascript:Richfaces.hideModalPanel('panel')">X</span>
               <h:panelGroup layout="block" styleClass="scrolls">
               <rich:dataTable value="#{dataTableScrollerBean.selectedCars}" var="sel" id="table">
               <f:facet name="header"><h:outputText value="Make" /></f:facet>
               <h:outputText value="#{sel.make}" />
               <rich:column id="model">
               <f:facet name="header"><h:outputText value="Model" /></f:facet>
               <h:outputText value="#{sel.model}" />
               <rich:column id="price">
               <f:facet name="header"><h:outputText value="Price" /></f:facet>
               <h:outputText value="#{sel.price}" />
               <rich:column id="mileage">
               <f:facet name="header"><h:outputText value="Mileage" /></f:facet>
               <h:outputText value="#{sel.mileage}" />
               <rich:column id="stock">
               <f:facet name="header"><h:outputText value="Stock" /></f:facet>
               <h:outputText value="#{sel.stock}" />

              dataTable ScrollerBean is defined as request scope bean in faces-config.xml
              Environment is Tomcat 6.0.18

              I have got a little further with some sorting of my own data - but for some reason, I can only sort in one direction when clicking on header - any ideas why?