1

如何style在用户输入文本后调用事件模糊时更新第二个 panelGrid licplate?我尝试了下面的代码,但出现错误:

错误 [http-bio-8080-exec-28][render_portlet_jsp:154] javax.faces.FacesException:找不到标识符为“panelInfo.Show()”的组件引用自

<p:panelGrid styleClass="noborder valigntop">
    <p:row>
        <p:column>
            <p:panelGrid styleClass="noborder">
                <p:row>
                    <p:column>
                        <p:inputText id="licplate" value="#{gateBacking.queue.fleet}" >
                            <p:ajax event="blur" update="panelInfo.Show();" />
                        </p:inputText>
                    </p:column>
                </p:row>
            </p:panelGrid>
        </p:column>
        <p:column>
            <p:panelGrid widgetVar="panelInfo" styleClass="border" style="visibility:hidden;">
                <p:row>
                    //---
                </p:row>
            </p:panelGrid>
        </p:column>
    </p:row>
</p:panelGrid>

谢谢!


编辑

代码显示隐藏面板,但之后,按钮不起作用。

...
<p:tab id="tabXXX" title="XXX"> 
    <h:form id="frmXXX">
        <script type="text/javascript">
            function test(){
                 $(PrimeFaces.escapeClientId('frmXXX:opt')).css("display","block");
            }
        </script>

        <p:messages id="prmMessage" autoUpdate="false" closable="true" />

        <p:panelGrid id="pnlXXX">
            <p:row>
                <p:column>
                    <p:panelGrid>
                        <p:row>
                            <p:column><p:outputLabel for="valLbl" value="Value : " /></p:column>
                            <p:column>
                                <p:inputText id="valLbl" value="#{...}" required="true">
                                    <p:ajax event="blur" update="olLicPlate" oncomplete="test();" />
                                </p:inputText>
                            </p:column>
                            <p:column><p:message for="valLbl" display="icon" /></p:column>
                        </p:row>
                    </p:panelGrid>
                </p:column>
                <p:column>
                    <p:outputPanel id="opt" style="display:none;">
                        <p:panelGrid id="pnlInfo">
                            ...
                        </p:panelGrid>
                    </p:outputPanel>
                </p:column>
            </p:row>
            <p:row>
                <p:column colspan="2">
                    <p:panelGrid>
                        <p:row>
                            <p:column>
                                <p:commandButton id="btnAdd" value="Add"
                                    action="#{...}" process="@form"
                                    update="pnlXXX,prmMessage"></p:commandButton>
                            </p:column>
                        </p:row>
                    </p:panelGrid>
                </p:column>
            </p:row>
        </p:panelGrid>
    </h:form>
</p:tab>
...
4

1 回答 1

4

update属性用于在 ajax 调用完成后更新组件。如果您想在 ajax 调用完成后调用一些 javascript 函数,您必须使用 inoncomplete onsuccessfullonerror(您的选择):

  • 在你的情况下,你试试

    <p:ajax event="blur" oncomplete="panelInfo.show();" />
    
    <p:panel visible="false" widgetVar="panelInfo">
                //content here
    </p:panel>
    
  • 你可以使用 outputPanel,我用 ajax 测试过:

         <h:form id="description">            
            <script type="text/javascript">
                function test(){
                     $(PrimeFaces.escapeClientId('description:opt')).css("display","block");
                }
            </script>
            <p:outputPanel id="opt" style="display:none;">
                <p:commandButton process="@this" value="test" actionListener="#{user.Test}"/>
            </p:outputPanel>
            <p:inputText id="licplate" value="zzzz" >
                <p:ajax event="blur" oncomplete="test();" />
            </p:inputText>
        </h:form>
    
于 2013-05-02T03:14:46.290 回答