1 Reply Latest reply on Jan 12, 2011 5:00 AM by Patrick Quinn

    Rerender commandButton with componentControl breaks component control.

    Patrick Quinn Newbie

      Hi,

       

      I have a rich toobar with toolbar groups and command buttons. I want to enable/disable buttons on the toolbar. Some of the command buttons show a modal panel using component control. On initial render of the window, the button will work. After it is re-rendered by another component the button will no longer show the panels.

       

      Below is stripped down code to display the problem.

       

      {code:xml}

      <rich:page xmlns="http://www.w3.org/1999/xhtml"

                xmlns:ui="http://java.sun.com/jsf/facelets"

                xmlns:h="http://java.sun.com/jsf/html"

                xmlns:f="http://java.sun.com/jsf/core"

                xmlns:a4j="http://richfaces.org/a4j"

                xmlns:rich="http://richfaces.org/rich" pageTitle="Test"

                markupType="xhtml">

                <h:form>

                          <h:panelGrid columns="1" id="panelGrid">

                                    <h:commandButton id="testButton" value="Show Modal Panel"

                                              onclick="return false;">

                                              <rich:componentControl for="modal_panel" attachTo="testButton"

                                                        operation="show" event="onclick" />

                                    </h:commandButton>

                                    <a4j:commandLink value="Re-render and break Button"

                                              reRender="testButton" />

                                    <a4j:commandLink value="Re-render and button ok" reRender="panelGrid" />

                          </h:panelGrid>

                </h:form>

                <rich:modalPanel id="modal_panel" resizeable="false"

                          trimOverlayedElements="false" autosized="true">

                          <f:facet name="header">

                                    <h:panelGroup>

                                              <h:outputText value="Test panel"></h:outputText>

                                    </h:panelGroup>

                          </f:facet>

                          <a4j:form ajaxSubmit="true">

                                    <h:panelGrid columns="1">

                                              <h:outputText id="message" value="Panel message" />

                                              <f:facet name="footer">

                                                        <h:panelGrid columns="2">

                                                                  <a4j:commandButton id="okButton" value="OK">

                                                                            <rich:componentControl for="modal_panel" attachTo="okButton"

                                                                                      operation="hide" event="onclick" />

                                                                  </a4j:commandButton>

                                                        </h:panelGrid>

                                              </f:facet>

                                    </h:panelGrid>

                          </a4j:form>

                </rich:modalPanel>

      </rich:page>

      {code}

       

       

       

       

      Is this expected behaviour for commandButtons with component control or is this a bug?

       

      I think I can work around this problem using commandLinks and graphic images for my toolbar. When inspected using Chrome, the javascript to open the panel is at the same level as the command button but when using a command link the javascript is a child of the link.

       

      Also of note is that if I rerender the panel grid around the command button the button starts to work as expected again.

       

      I'm using richfaces version 3.3.3.

       

      Thank in advance,

      Patrick

        • 1. Re: Rerender commandButton with componentControl breaks component control.
          Patrick Quinn Newbie

          Below is how I eventually got the behaviour I wanted.

           

          {code:xml}<a4j:commandButton id="processButton"

               onclick="#{rich:component('modal_panel')}.show(); return false;"

               disabled="#{!myBean.selectionModel.selectionOkForProcess}"

               rendered="#{authorityBean.process}"

               image="/images/process.gif">

               <rich:toolTip>Process items</rich:toolTip>

          </a4j:commandButton>{code}

           

          I could not get the desired behaviour using componentControl. I tried using the rendered attribute of componentControl along with the disabled attribute of the commandButton and rerendering both the button and the component control but this didn't work also.

           

          From what I can see componentControl is good if it's simple showing and hiding. Once disabling and enabling come into it it's not up to the task.