Home/ Questions/Q 6885357
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-27T05:37:28+00:00

I am facing a problem rendering a data table when selecting a date from

  • 0

I am facing a problem rendering a data table when selecting a date from <rich:calendar>. I use <a4j:ajax> for the rendering but with no effect. Here is the code sample:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:rich="http://richfaces.org/rich"
    xmlns:a4j="http://richfaces.org/a4j"
    xmlns:composite="http://java.sun.com/jsf/composite">

    <rich:panel header="#{lang.reportPanelHeader}" id="panel" rendered="#{navigation.reportRendered}" width="700px" style="margin-left:250px">
        <a4j:status onstart="#{rich:component('statPane')}.show()" onstop="#{rich:component('statPane')}.hide()" />
        <h:form id="data_table_form">
            <rich:dataTable value="#{validateReportAction.reportList}" var="report" iterationStatusVar="it" id="data_table" rows="5">
               <rich:column>
                   <f:facet name="header">#</f:facet>
                   #{it.index  + 1}
               </rich:column>

               <rich:column>
                   ....
               </rich:column>

                <f:facet name="footer">
                    <rich:dataScroller page="#{validateReportAction.page}" />
                </f:facet>
            </rich:dataTable>
        </h:form>

        <rich:popupPanel id="statPane" autosized="true" style="border: none; background-color: #e6e6e6;">
            ....
        </rich:popupPanel>

        <div id="bottom">
            <h:form id="calendarForm">
                <div id="left">                
                    <div class="input" id="test_cal">
                        <rich:calendar 
                            dataModel="#{calendarModel}"
                            value="#{validateReportAction.selectedDate}"
                            boundaryDatesMode="scroll"
                            required="true" 
                            requiredMessage="#{lang.dateRequiredMsg}" 
                            mode="ajax"
                            id="date"
                            datePattern="dd.MM.yyyy"
                            popup="false">

                            <a4j:ajax event="change" render="@all"/>

                        </rich:calendar>

                        <span class="error_msg">
                            <rich:message for="date" ajaxRendered="true"/>
                        </span>
                    </div>
                </div>
            </h:form>
        </div>
    </rich:panel>

</ui:composition>

I am forced to use @all in the calendar in <a4j:ajax event="change" render="@all"/> but I want to render only the data table. How can I do this?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Since it’s located in a different naming container parent, you need to refer it by its absolute client ID. To find it out, open the page in the webbrowser. Rightclick and View Source. Locate the HTML <table> element which is generated by <rich:dataTable id="data_table">. It’ll look something like this:

    <table id="data_table_form:data_table">

    You need to take exactly that ID, prefix with the JSF naming container separator character (which defaults to :) and use it in the render attribute.

    <a4j:ajax event="change" render=":data_table_form:data_table" />

    See also:

    • 0