ajaxKeys with sortable dataTable problem

[nickthomson]

I'm using ajaxKeys on a dataTable to control which rows are reRendered after an update. I have it working fine with a standard table and even with pagination using the datascroller.

However, when I use the sorting capabilities of the dataTable, the rows do not highlight properly. I'm guessing this is because they are in a different order to the list I store the data in and therefor the wrong indexes are being returned.

My data table in my test app looks like this:

 <rich:dataTable id="testDataTable" value="#{testBean.data}" var="data" ajaxKeys="#{testBean.ajaxKeys}" sortMode="single">

 <rich:column sortBy="#{data.id}" sortOrder="#{testBean.orderID}" id="pid" style="#{data.viewing ? 'background: red' : '' }">
 <f:facet name="header">
 <h:outputText value="ID"/>
 </f:facet>
 <a4j:commandLink style="display: block; width: 100%;" action="#{testBean.SelectView(data)}" value="#{data.id}" reRender="pid,param1"/>
 </rich:column>

 <rich:column sortBy="#{data.testParam1}" sortOrder="#{testBean.orderParam1}" id="param1" style="#{data.viewing ? 'background: red' : '' }">
 <f:facet name="header">
 <h:outputText value="Param 1"/>
 </f:facet>
 <a4j:commandLink style="display: block; width: 100%;" action="#{testBean.SelectView(data)}" value="#{data.testParam1}" reRender="pid,param1"/>
 </rich:column>
 </rich:dataTable>

And the appropriate parts of the backing bean:

private List<TestData> data = new ArrayList<TestData>();

private TestData selectedItem = null;
private HashSet<Integer> ajaxKeys = new HashSet<Integer>();

public void SelectView(TestData data) {
 this.ajaxKeys.clear();
 this.ajaxKeys.add(this.data.indexOf(this.selectedItem));
 this.selectedItem.setViewing(false);
 this.selectedItem = data;
 this.selectedItem.setViewing(true);
 this.ajaxKeys.add(this.data.indexOf(this.selectedItem));
 System.out.println(this.ajaxKeys.toString());
}

public TestData getSelectedItem() {
 return selectedItem;
}

public void setSelectedItem(TestData selectedItem) {
 this.selectedItem = selectedItem;

public Set<Integer> getAjaxKeys() {
 return this.ajaxKeys;
}

Anyone have any suggestion how to fix this?

Thanks.

[nbelaevski]

Hello,

Have you tried this with 3.3.1.CR1?

[nickthomson]

Hi,

Sorry should have included version info. My original post was using version 3.3.0.GA, I've just tested with 3.3.1.CR1 with the same results.

[ilya_shaikovsky]

This is expected behavior. You using
this.data.indexOf(this.selectedItem)
and we aren't sorting the data in your model actually. So the index of the item in the original model aren't the same with rowKey in selected list.

[nbelaevski]

You don't have to use ajaxKeys. Keys for activated (the ones containing clicked a4j:commandButton) are automatically added into internal ajax keys set of component if you not define one explicitly.

[nickthomson]

Can you expand on this please nbelaevski? Because if I don't use ajaxKeys, I see the while table being re-rendered, which is what I'm trying to avoid.

[nickthomson]

"Nick Thomson" wrote:
Can you expand on this please nbelaevski? Because if I don't use ajaxKeys, I see the while table being re-rendered, which is what I'm trying to avoid.

Obviously meant "I see the while table being re-rendered"

[nickthomson]

"Nick Thomson" wrote:

"Nick Thomson" wrote:
Can you expand on this please nbelaevski? Because if I don't use ajaxKeys, I see the while table being re-rendered, which is what I'm trying to avoid.

Obviously meant "I see the whole table being re-rendered"

d'oh

[nbelaevski]

Hello,

This works well for me:

<rich:dataTable value="#{forum5Bean.lotOfData}" var="item">
 <rich:column id="c" sortBy="#{item}">
 <f:facet name="header">header</f:facet>

 <a4j:commandLink reRender="c">
 <h:outputText value="#{item} #{time}"/>
 </a4j:commandLink>
 </rich:column>
 </rich:dataTable>

using 3.3.1.CR2

[nickthomson]

Yes, that certainly does seem to be rerender just the clicked on row and is as fast as using ajaxKeys (even in 3.3.0.GA that I'm using), but I also need it to rerender the last row clicked on as well (to clear the highlight), and it doesn't seem to be doing that. Any ideas how to get it doing that?

Thanks.

[nickthomson]

I'm still looking for a way to reRender locate the previously selected item in a rich:dataTable when a new row is clicked and to reRender both the previous row and the new one.

I can't store the row when its originally clicked as the user may resort the table and my data doesn't get resorted too. I can hack it with jQuery, but there must be a way to do this..

[ilya_shaikovsky]

But you could store the current item itself. and then find it in the original collection on selection change.

[nickthomson]

I have the pojo's for both the currently selected item and the previously selected item.

However by specifying the reRender on the columns rather than the whole table, it apears only the row containing the link that was clicked on (the currently selected item) will be redrawn.

I need to redraw the previously selected row as well, to remove the highlight (an alternate background color) from that row.

Given the sort order of the table may not be the same as the original data (a List<>), the indexOf will not necessarily give the correct row number (which was my original problem).

Additionally, storing the rowKey of the last selected item will not work either, as the user may resort the table between clicks.