3 Replies Latest reply on Oct 26, 2011 10:23 AM by Andrey Sisoyev

    rich:collapsibleSubTable and h:selectBooleanCheckbox value issue

    Alexandre Lavoie Newbie

      Hi,

       

      I was using a multi-level table to select items from differents groups built with rich:dataTable and rich:collapsibleSubTable but in the actionListener the checkboxes in subTable level doesn't get right values. This issue is since the RichFaces 3.3.3 to RichFaces 4.0.0 upgrade. I've changed the code to use c:forEach with rich:dataTable and it seems to work fine now but I would be glad to use power of RichFaces!

       

      See the attachment for the codes examples, note that the second solution is a drop in replacement that works, no changes on managed beans or other code in page.

       

      Thank you,

       

      Alexandre.

        • 1. Re: rich:collapsibleSubTable and h:selectBooleanCheckbox value issue
          Andrey Sisoyev Newbie

          Hi!

           

          Have the same problem. Tested for code

          ...

          <h:form>

              <rich:dataTable value="#{tableBean.testData}" var="testDataRow">

                  <f:facet name="header">

                      <rich:columnGroup>

                          <rich:column>col1</rich:column>

                          <rich:column>col2</rich:column>

                      </rich:columnGroup>

                  </f:facet>

                             

                  <rich:column>SUPER: #{testDataRow.first.first}</rich:column>

                  <rich:column><h:selectBooleanCheckbox value="#{testDataRow.first.second}"/></rich:column>

                  <rich:collapsibleSubTable value="#{testDataRow.second}" var="testDataSubRow">

                          <rich:column>   SUB: #{testDataSubRow.first}</rich:column>

                          <rich:column><h:selectBooleanCheckbox value="#{testDataSubRow.second}"/></rich:column>

                  </rich:collapsibleSubTable>

                 

              </rich:dataTable>

              <h:commandButton label="submot"/>

          </h:form>

          ...

          , on submit is updates checkboxes of dataTable rows, but won't update subTable's ones.

           

          There seems to be a bug in APPLY VALUES JSF phase, when using checkbox in the collapsibleSubTable.

           

          Thus, in RF4 there's no equivalent for the 3.3.3 <rich:subTable>, unless it was read-only.

          • 2. Re: rich:collapsibleSubTable and h:selectBooleanCheckbox value issue
            Andrey Sisoyev Newbie

            Here's a working workaround, that ajaxifies form input.

            <h:form>

                <rich:dataTable rowKeyVar="rowIndex" ...>

                    <rich:collapsibleSubTable rowKeyVar="subRowIndex" ...>

                        <rich:column>

                            <a4j:jsFunction name="workaroundUpdate#{rowIndex}#{subRowIndex}"

                                            status="sink"

                                            onbegin="javascript:disableCommitButton()"

                                            oncomplete="javascript:enableCommitButton()">

                                <a4j:param name="newValue" assignTo="#{subRow.field}"/>

                            </a4j:jsFunction>

                            <h:selectBooleanCheckbox value="#{subRow.field}" onchange="workaroundUpdate#{rowIndex}#{subRowIndex}(this.checked)"/>

                        </rich:column>

                    </rich:collapsibleSubTable>

                </rich:dataTable>

             

                <script type="text/javascript">

                    disableCommitButton = function(){#{rich:element('CommitButton')}.disabled=true;}

                    enableCommitButton  = function(){#{rich:element('CommitButton')}.disabled=false;}

                </script>

                <a4j:status id="sink"/>

                <h:commandButton id="CommitButton" .../>

            </h:form>

            Not sure if disabling/enabling commit button is really needed - I added it for the thread safetiness. If RF/JSF serializes a4j and form submit events, then it's not needed.

            • 3. Re: rich:collapsibleSubTable and h:selectBooleanCheckbox value issue
              Andrey Sisoyev Newbie

              It's harder with h:inputText (working workaround):

              <h:form>

                  <rich:dataTable rowKeyVar="rowIndex" ...>

                      <rich:collapsibleSubTable rowKeyVar="subRowIndex" ...>

                          <rich:column>

                              <a4j:jsFunction name="workaroundUpdate#{rowIndex}#{subRowIndex}" status="sink" onbegin="javascript:onFieldUpdateBegin('#{rowIndex}#{subRowIndex}')" oncomplete="javascript:onFieldUpdateComplete('#{rowIndex}#{subRowIndex}')">

                                  <a4j:param name="newValue" assignTo="#{subRow.field}"/>

                              </a4j:jsFunction>

                              <h:inputText value="#{subRow.field}"

                                  onchange="workaroundUpdate#{rowIndex}#{subRowIndex}(this.value)"

                                  onfocus="javascript:enterField(this.value, '#{rowIndex}#{subRowIndex}');"

                                  onblur="javascript:leaveField(this.value, '#{rowIndex}#{subRowIndex}');"/>

                          </rich:column>

                      </rich:collapsibleSubTable>

                  </rich:dataTable>

               

                  <a4j:status id="sink"/>

                  <h:commandButton id="saveButton" .../>

                  <br/>

                  <h:outputText id="unfocusHint" value="#{msg.unfocus_hint}" styleClass="grayLittleHint" style="text-align:center;"/> <!-- (leave the input field - the button will become enabled) -->

                  <script type="text/javascript">

                      curField = null;

                      fieldBeingUpdated = null;

               

                      disableSaveButton = function(){#{rich:element('saveButton')}.disabled=true;};

                      enableSaveButton  = function(){#{rich:element('saveButton')}.disabled=false;};

               

                      showUnfocusHint = function(){#{rich:element('unfocusHint')}.style.display='block';};

                      hideUnfocusHint = function(){#{rich:element('unfocusHint')}.style.display='none';};

               

               

                      enterField = function(curVal,field) {

                          curField = field;

                          disableSaveButton();showUnfocusHint();

                      };

                      leaveField = function(curVal,field) {

                          if((field == curField || curField == null) &amp;&amp; fieldBeingUpdated == null) {

                             enableSaveButton();hideUnfocusHint();

                             curField = null;

                          }

                      };

               

                      onFieldUpdateBegin = function(field) {

                          fieldBeingUpdated = field;

                          disableSaveButton(); showUnfocusHint();

                      };

                      onFieldUpdateComplete = function(field) {

                          if(field == curField || curField == null) {

                              fieldBeingUpdated = null;

                              enableSaveButton(); hideUnfocusHint();

                          }

                          if(field == fieldBeingUpdated) {

                              fieldBeingUpdated = null;

                          }

                      };

               

               

                      hideUnfocusHint();

                  </script>

              </h:form>