Ajax-render a table which is inside a different form

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?

Answers


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" />

Need Your Help

Parsing a String in MIPS

string parsing mips

I am writing a program in Mips that is given this asciiz string: .asciiz "7A23232". Each character in the string corresponds to a card from a deck of cards. I need to check for two of a kinds and ...

test if page is valid before running javascript

javascript asp.net validation

I have some javascript that "freezes" the screen when a submit button is pressed. This is to stop double clickers.

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.