ScrollableDataTable can not be reRendered by a4j:push

[darmstadter]

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>

]

[fmarwede]

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 (?)

[fmarwede]

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

[darmstadter]

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

[fmarwede]

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.

[darmstadter]

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.

[fmarwede]

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.

[darmstadter]

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.

[fmarwede]

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.

[fmarwede]

Would be great, if somebody could verify that.

[adubovsky]

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.