10 Replies Latest reply on Feb 19, 2009 8:13 AM by Aleksandr Dubovsky

    ScrollableDataTable can not be reRendered by a4j:push

    Dongyao Zhao Novice

      ScrollableDataTable can not be reRendered by a4j:push. Only the SDT is wrapped with a4j:outputPanel. But after sort the head of the SDT is disappeared and crash the whole table. I use RF:3.3.0, jsf-1.2, FF:3.0.6 and IE7. ps. The SDT can be reRendered by a a4j:commandButton.

      <a4j:outputPanel layout="block" id="tableId">
       <ui:include src="/panel/dataTable.xhtml" />
      </a4j:outputPanel>
      


      SDT:
       <ui:composition xmlns="http://www.w3.org/1999/xhtml"
       xmlns:f="http://java.sun.com/jsf/core"
       xmlns:h="http://java.sun.com/jsf/html"
       xmlns:rich="http://richfaces.org/rich"
       xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
       xmlns:ui="http://java.sun.com/jsf/facelets"
       xmlns:dim="http://dimetis.de/jsf">
       <rich:scrollableDataTable id="table" height="200px" width="220px"
       value="#{appBean.items}" var="item" sortMode="single" rows="25"
       rowClasses="taskRows" columnClasses="taskColumns">
       <rich:column width="104px" sortable="true" id="name">
       <f:facet name="header">
       <h:outputText value="Name"/>
       </f:facet>
       <a4j:outputPanel layout="block" style="border:1px solid black">
       <rich:dragSupport dragIndicator=":form:indicator" dragType="pidDrag"
       dragValue="#{item.name}" ondragstart="forceReRenderDropZone()">
       <rich:dndParam name="label" value="#{item.name}" />
       </rich:dragSupport>
       <h:outputText value="#{item.name}" />
       </a4j:outputPanel>
       </rich:column>
       <rich:column width="104px" sortable="true" id="value">
       <f:facet name="header">
       <h:outputText value="Value"/>
       </f:facet>
       <div style="margin-top:2px;display:block;">
       <h:outputText value="#{item.value}" />
       </div>
       </rich:column>
       <rich:componentControl id="taskcontrolid" for="tContextMenu" operation="show"/>
       </rich:scrollableDataTable>
      </ui:composition>
      


      a4j:push come from richfaces demo

      <h:form>
       <a4j:push interval="1000" eventProducer="#{push.addListener}" oncomplete="alert('updated');"
       reRender="tableId" enabled="#{push.enabled}" id="push" ajaxSingle="true"/>
       <rich:panel>
       <f:facet name="header">
       <h:outputText value="Push Example"/>
       </f:facet>
       <h:panelGrid columns="1" id="out">
       <h:outputText rendered="#{!push.enabled}" value="Press Start to run push example"/>
       <h:panelGroup rendered="#{push.enabled}">
       <h:outputText value="Generated UUID:"/>
       <h:outputText value="#{push.uuid}"/>
       </h:panelGroup>
       <h:panelGroup>
       <a4j:commandButton value="Start" action="#{push.start}"
       ajaxSingle="true" rendered="#{!push.enabled}" reRender="push, out"/>
       <a4j:commandButton value="Stop" action="#{push.stop}"
       ajaxSingle="true" rendered="#{push.enabled}" reRender="push, out"/>
       </h:panelGroup>
       </h:panelGrid>
       </rich:panel>
       </h:form>
      
      ]

        • 1. Re: ScrollableDataTable can not be reRendered by a4j:push
          Florian Marwede Expert

          Hi,
          i tried a very simple example to test SDT with a4j:push and this works. Please try it:

          <h:form>
           <rich:scrollableDataTable id="scrolltable" value="#{appBean.items}" var="item">
           <rich:column width="100px">
           <f:facet name="header">
           <h:outputText value="Name"/>
           </f:facet>
           <h:outputText value="#{item.name}" />
           </rich:column>
           </rich:scrollableDataTable>
          
           <a4j:push eventProducer="#{appBean.addPushListener}" interval="1000" ajaxSingle="true" reRender="scrolltable" />
          
           <a4j:commandButton value="Show Current Selection" action="#{appBean.addNewItem}"/>
          
          </h:form>
          


          Java code:

           public void addNewItem() {
           String name = "ABC" + ++counter;
           items.add(new Item(name));
           synchronized (pushListener) {
           pushListener.onEvent(new EventObject(this));
           }
           }
          
           public void addPushListener(EventListener listener) {
           synchronized (listener) {
           if (pushListener != listener) {
           pushListener = (PushEventListener) listener;
           }
           }
           }
          


          In my opinion the problem is not the combination of SDT and a4j:push itself but maybe with something else in the table. Maybe outputpanels or D&D stuff in the table breaks it (?)


          • 2. Re: ScrollableDataTable can not be reRendered by a4j:push
            Florian Marwede Expert

            Another experiment on that topic: I built in a simple functionality in my sample SDT, so you can change row positions per D&D.

             <rich:scrollableDataTable id="scrolltable"
             value="#{appBean.items}" var="item" >
             <rich:column width="100px">
             <f:facet name="header">
             <h:outputText value="Name"/>
             </f:facet>
             <a4j:outputPanel layout="block">
             <rich:dragSupport dragIndicator=":form:indicator" dragType="itemDD"
             dragValue="#{item.name}" >
             <rich:dndParam name="label" value="#{item.name}" />
             </rich:dragSupport>
             <rich:dropSupport acceptedTypes="itemDD" dropValue="#{item.name}"
             dropListener="#{appBean.processDrop}" reRender="scrolltable"/>
             <h:outputText value="#{item.name}" />
             </a4j:outputPanel>
             </rich:column>
             </rich:scrollableDataTable>
            


            Java code:

             public void processDrop(DropEvent event)
             {
             String dragId = event.getDragValue().toString();
             String dropId = event.getDropValue().toString();
             Item droppedItem = null;
             Item draggedItem = null;
             for (Item item : items) {
             if (item.getName().equals(dropId)) {
             droppedItem = item;
             }
             if (item.getName().equals(dragId)) {
             draggedItem = item;
             }
             }
             if (droppedItem != null && draggedItem != null) {
             items.remove(draggedItem);
             items.add(items.indexOf(droppedItem), draggedItem);
             }
             }
            


            The only problem is, that the rerendering of the SDT after the drop doesn't work. Perhaps that is related to https://jira.jboss.org/jira/browse/RF-6150.

            I hope, Konstantin Mishin will comment this issue.

            Best regards,
            Florian

            • 3. Re: ScrollableDataTable can not be reRendered by a4j:push
              Dongyao Zhao Novice

              Thank you Florian, i will try it and report later.

              • 4. Re: ScrollableDataTable can not be reRendered by a4j:push
                Florian Marwede Expert

                A workaround for the D&D problem: We use the working rerendering of the push:

                 public void processDrop(DropEvent event)
                 {
                 String dragId = event.getDragValue().toString();
                 String dropId = event.getDropValue().toString();
                 Item droppedItem = null;
                 Item draggedItem = null;
                 for (Item item : items) {
                 if (item.getName().equals(dropId)) {
                 droppedItem = item;
                 }
                 if (item.getName().equals(dragId)) {
                 draggedItem = item;
                 }
                 }
                 if (droppedItem != null && draggedItem != null) {
                 items.remove(draggedItem);
                 items.add(items.indexOf(droppedItem), draggedItem);
                 }
                 synchronized (pushListener) {
                 pushListener.onEvent(new EventObject(this));
                 }
                 }
                


                So it is verified: The drop rerendering concerning the SDT is broken.

                By the way: I use RF 3.3.1 (from 5th february) and FF 3.1.6 for testing.

                • 5. Re: ScrollableDataTable can not be reRendered by a4j:push
                  Dongyao Zhao Novice

                  Thanks for Florian's advices.
                  brief summary: a4j:push must with SDT in the same <h:form> and set up immediate="true", then reRender the wrapped a4j:outputPanel of the SDT or the SDT itself, it works, otherwise the head is disappeared and layout crashed.

                  • 6. Re: ScrollableDataTable can not be reRendered by a4j:push
                    Florian Marwede Expert

                    Hmm...again, for me the following works, also with different forms for SDT and push and without immediate:

                    <h:form>
                    <rich:scrollableDataTable id="scrolltable" value="#{appBean.items}" var="item">
                    <rich:column width="100px">
                    <f:facet name="header">
                    <h:outputText value="Name"/>
                    </f:facet>
                    <h:outputText value="#{item.name}" />
                    </rich:column>
                    </rich:scrollableDataTable>
                    </h:form>
                    <h:form>
                    <a4j:push eventProducer="#{appBean.addPushListener}" interval="1000" ajaxSingle="true" reRender="scrolltable" />

                    <a4j:commandButton value="Show Current Selection" action="#{appBean.addNewItem}"/>

                    </h:form>

                    Please try it. And please notice, that I use the command button to activate the push. I don't think so, but maybe you got problems with using it for a "real" server side push.

                    • 7. Re: ScrollableDataTable can not be reRendered by a4j:push
                      Dongyao Zhao Novice

                      yes, your are right, with different form a4j:push can reRender SDT too. But after sort of the SDT then reRender by push, the layout crashed.

                      • 8. Re: ScrollableDataTable can not be reRendered by a4j:push
                        Florian Marwede Expert

                        Okay, i can reproduce that. Let's summarize:

                        - Sorting in SDT breaks D&D. This is already tracked: https://jira.jboss.org/jira/browse/RF-6150

                        - Sorting in SDT breaks a4j:push. I think this is not tracked until now.

                        - Rerendering of drop in SDT doesn't work. I think this is not tracked until now.

                        Let's wait if somebody of the RF-Team can verify that so we can create two new issues.

                        • 9. Re: ScrollableDataTable can not be reRendered by a4j:push
                          Florian Marwede Expert

                          Would be great, if somebody could verify that.

                          • 10. Re: ScrollableDataTable can not be reRendered by a4j:push
                            Aleksandr Dubovsky Newbie

                            Hi all,

                            - Sorting in SDT breaks a4j:push. https://jira.jboss.org/jira/browse/RF-6261

                            - Rerendering of drop in SDT doesn't work. https://jira.jboss.org/jira/browse/RF-6260

                            Thanks for your participation.