微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Ajax-呈现一个不同形式的表

从< rich:calendar>中选择日期时,我在渲染数据表时遇到问题.我使用< a4j:ajax>用于渲染但没有效果.这是代码示例:

<!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>

我被迫在日历中使用@all在< a4j:ajax event =“change”render =“@ all”/>但我想只渲染数据表.我怎样才能做到这一点?

解决方法

由于它位于不同的命名容器父级中,因此您需要通过其绝对客户端ID来引用它.要找到它,请在webbrowser中打开页面.右键单击并查看源代码.找到HTML< table>由< rich:dataTable id =“data_table”>生成的元素.它看起来像这样:

<table id="data_table_form:data_table">

您需要使用该ID,前缀为JSF命名容器分隔符(认为:)并在render属性中使用它.

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

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。

相关推荐