Editable tabular data the seam way?

[dajevtic]

Hi everyone?
I have a question regarding a how to:
I want to have a dataTable (jsf ri or richfaces) where I have editable tabular data from a database table. I want (almost) every column to be editable (similar to excel). What is the best (technical) approach to achieve this?
Using framework configurations in components.xml is no good, because the EntityQuery is not held in any context, but is thrown away after the request ends. Also if I want to page fordward or backwards my changes will be discarded and the data will be read from the database again, ignoring my changes.
Currently I have an EJB3 stateful session bean that extends EntityQuery and I can instantiate it in components.xml with any Entity class!
However, I am not sure if there is a better (nicer) way to achieve this.
What is the real Seam-Way to get tabular editable data working?

[pmuir]

"dajevtic" wrote:
I have a question regarding a how to:
I want to have a dataTable (jsf ri or richfaces) where I have editable tabular data from a database table. I want (almost) every column to be editable (similar to excel). What is the best (technical) approach to achieve this?

I would use a h:dataTable backed by a CONVERSATION scoped EntityQuery. N.B. You can configure the scope of a component in components.xml

Also if I want to page fordward or backwards my changes will be discarded and the data will be read from the database again, ignoring my changes.

If you are in a CONVERSATION this shouldn't happen.

[trickyvail]

Pete,

When you say CONVERSATION do you specifically mean a LONG RUNNING CONVERSATION or a TEMPORARY CONVERSATION?

Is there a standard meaning of "Long Running Conversation" when members post "Conversation" in messages of this forum?

I think it may also be necessary for the links or buttons that perform pagination to take part in the submission of the dataTable fields (ie the jsf postback) in order to update the database.

[pmuir]

Yes, a long running conversation. A temporary conversation is not very interesting.

[dajevtic]

I agree, as I have tried your approach before, Pete.
Unfortunately it didn't work with pagination, that's why I decided to have a SFSB which extends EntityQuery.

I would really appreciate a Seam example where I can have a dataTable (fine if it's not richfaces datatable, but nice-to-have ;-)
with a bunch of inputTexts inside columns, where pagination, sorting, etc. works without having to check if the submitted values really belong into the currently (visible) row.

I am quite certain that Seam does not provide this functionality out-of-the-box now, but if you think it's worth a feature request, I'll be glad to post it.

The reason why I don't like my SFSB approach is that it may not work in future releases because of possible framework changes + my SFSB expects all entities to extend one special MappedSuperclass named PersistableObject.

[pmuir]

We have this issue http://jira.jboss.com/jira/browse/JBSEAM-1260 - adding comments to that is a good idea (and vote for it if you want it done!)

[dajevtic]

Done, Pete. Thanks!

Any idea how to resolve the paging issue (form submission with pagination) in the meantime?

[pmuir]

Post the code you are using.

[dajevtic]

Pete, I'll start off with a very simple example:
Replace the following code inside search.xhtml of the contactlist example application:

<!-- search results -->
 <table>
 <tr>
 <th>Name</th>
 <th>Cell Phone</th>
 <th>Home Phone</th>
 <th>Address</th>
 <th>City</th>
 <th>State</th>
 <th>Zip</th>
 <th>Country</th>
 </tr>
 <ui:repeat value="#{contacts.resultList}" var="cont">
 <tr>
 <td>
 <s:link view="/viewContact.xhtml" value="#{cont.firstName} #{cont.lastName}">
 <f:param name="contactId" value="#{cont.id}"/>
 </s:link>
 </td>
 <td>#{cont.cellPhone}</td>
 <td>#{cont.homePhone}</td>
 <td>#{cont.address}</td>
 <td>#{cont.city}</td>
 <td>#{cont.state}</td>
 <td>#{cont.zip}</td>
 <td>#{cont.country}</td>
 </tr>
 </ui:repeat>
 </table>

with this code:

 <h:dataTable rendered="#{not empty contacts.resultList}" value="#{contacts.resultList}" var="cont">
 <h:column>
 <s:link view="/viewContact.xhtml" value="#{cont.firstName} #{cont.lastName}">
 <f:param name="contactId" value="#{cont.id}"/>
 </s:link>
 </h:column>
 <h:column>
 <f:facet name="header">Name</f:facet>
 <h:inputText value="#{cont.lastName}" />
 </h:column>
 <h:column>
 <f:facet name="header">Cell Phone</f:facet>
 <h:inputText value="#{cont.cellPhone}" />
 </h:column>
 <h:column>
 <f:facet name="header">Home Phone</f:facet>
 <h:inputText value="#{cont.homePhone}" />
 </h:column>
 <h:column>
 <f:facet name="header">Address</f:facet>
 <h:inputText value="#{cont.address}" />
 </h:column>
 <h:column>
 <f:facet name="header">City</f:facet>
 <h:inputText value="#{cont.city}" />
 </h:column>
 <h:column>
 <f:facet name="header">State</f:facet>
 <h:inputText value="#{cont.state}" />
 </h:column>
 <h:column>
 <f:facet name="header">Zip</f:facet>
 <h:inputText value="#{cont.zip}" />
 </h:column>
 <h:column>
 <f:facet name="header">Country</f:facet>
 <h:inputText value="#{cont.country}" />
 </h:column>
 </h:dataTable>
 <h:commandButton action="testHandler.save" value="Save entries">
 <s:conversationId />
 </h:commandButton>

TestHandler:

@Name("testHandler")
public class TestHandler
{

 @In(create=true)
 private EntityManager entityManager;

 @In
 private EntityQuery contacts;


 @Begin(join=true)
 public void saveEntries() {
 for (Contact cont : (List<Contact>)contacts.getResultList()) {
 entityManager.merge(cont);
 }
 }

}

Clicking on the save button one would assume that the changes inside the table should be saved to the underlying records, however weird behavior occurs when you either sort or page before making changes and then hit save:
e.g. When changing data on the second page, the records on the first page are updated, which makes sense, as there is not pagination attribute inside the h:commandLink
After having played around with sorting and all the other stuff I gave up and created the SFSB mentioned earlier. The bean is dependent on a small framework I created for dynamically creating tabled editable views, where you can configure which columns are visible, by which columns an "Autofilter" (like e.g. in Excel) is activated, automatic search over visible columns in the database, etc.
The code is quite large, but I'll be glad to supply it, if you think that it would be an interesting feature to add to Seam.

[dajevtic]

SMALL typo in the code:

<h:commandButton action="#{testHandler.save}" value="Save entries">
 <s:conversationId />
 </h:commandButton>

[dajevtic]

Furthermore, don't forget to place a form around the table and the commandButton.
Sorry, it's been a while since i dug up the code and I had changed it since.

[dajevtic]

Pete, in case you haven't tried yet, don't bother. I got it sorted out. Thanks for offering your help.
The problem was indeed, that when saving my data, I did not post the page ref during saving. Adding the parameter in my sort and save buttons, now the data in the data base is updated correctly.

One question remains though and it would be great if Seamone of you had the answer:
Fact: Once I access data from the data base and then page to the next records my previous data is thrown away. So far so good.

We have one use case, though, where we want to be able to edit data on one page, and the next, and so forth, but non of the edited data should be saved until we hit save. Taking the current approach we always reread the data from the data base, which is highly performant, but we always lose the edited data unless we save it.

Is it possible to use some kind of caching mechanism to store our changes until we hit save?