8 Replies Latest reply on Sep 22, 2010 9:04 AM by Fran Boragina

    ? how to use rich:calendar to filter by date?

    John Franey Novice

      I'm trying to get what I want out of the extendedDataTable filter feature.  Thank you if you can provide an answer.

       

      I have a date column in my extedendDataTable.  I've been able to filterby a date picked by a rich:calendar, but this is what it looks like:

       

      date-filter-by.png

       

      I would rather it look like this (bit of gimp editing here):

      date-filter-by-fixed.png

       

      This is my xhtml:

       

       

                  <rich:extendedDataTable id="assignmentsTable" var="assignment"
                            value="#{assignmentsList.resultList}"
                         rendered="#{not empty assignmentsList.resultList}"
                         rows="20">
                      <rich:column filterBy="#{assignment.type}" filterEvent="onkeyup" label="Type">
                          <f:facet name="header">Type</f:facet>
                          #{assignment.type}
                      </rich:column>
                      <rich:column filterBy="#{assignment.candidate.lastName}" filterEvent="onkeyup" label="Last Name">
                          <f:facet name="header">Last Name</f:facet>
                          <h:outputText  value="#{assignment.candidate.lastName}"/>
                      </rich:column>
                      <rich:column filterMethod="#{assignmentsList.filterByDate}" label="Class Date">
                                <f:facet name="header">
                                          <h:panelGroup>
                                                    <h:outputText value="Class Date" />
                                                    <br />
                                                    <rich:calendar value="#{assignmentsList.filterDate}" id="dateFilter" >
                                         <a4j:support ajaxSingle="true" event="onchanged" reRender="assignmentsTable, tableScroller"/>
                                                    </rich:calendar>
                                               </h:panelGroup>
                                </f:facet>
                                <h:outputText value="#{assignment.event.date}">
                                    <f:convertDateTime pattern="MMM-dd"/>
                                </h:outputText>
                      </rich:column>
                  </rich:extendedDataTable>
                <rich:datascroller id="tableScroller" align="left" for="assignmentsTable"/>