5 Replies Latest reply on Jul 26, 2010 3:50 AM by ilya_shaikovsky

How to insert a row in xxxxDataTable

xyzzy07 Jul 16, 2010 6:34 AM

Is there any way to insert (and delete) a row in a dataTable without re-rendering the entire table?

My ContactManager application has a 4,000 row table with draggable rows, so it takes 5 seconds or so to render. That's OK on startup, but I don't want to do this for every table update.

The UI that I am trying to achieve is that a user can click an "Add" button which inserts a blank row in the contacts table and then sets its fields to input fields of some type to allow the user to populate the new row. I've attached a simple screenshot to illustrate.

btw. I've just started working with RichFaces and so far it's been a wonderful experience. Great job guys!

Screenshot.png 8.9 KB

1. Re: How to insert a row in xxxxDataTable

ilya_shaikovsky Jul 21, 2010 9:23 AM (in response to xyzzy07)

no way to insert without updating parent.

B.t.w. why you trying to show all the 4000 ros to the client? I do not think user will go through all that list. I prefer to use pagging and some filter additionally to make it really convinient if requirements permits. Then the updates will not be so painfull and rendering will be fast.
Actions
2. Re: How to insert a row in xxxxDataTable

xyzzy07 Jul 22, 2010 3:13 AM (in response to ilya_shaikovsky)

Thx Ilya

In my app I want the user interface as responsive as a local app, hence the fewest possible server round-trips. The problem with paging is that there is no obvious way to predict which page a given contact is on. So the user clicks a page and then waits for that page of the table to download and render. I'm considering building alphabetic tabs and breaking my contacts down by initial letter. That was before I hit this problem https://community.jboss.org/message/553864#553864

I had a lot of problems with rendering of the built-in filtering so in the end just created my own search form outside the table.

The solution I finally settled on is to have my contacts load in an iframe in an unselected tab, so the initial load is quick while the contacts are populated in the background. When a user is inserting a new contact, the Contacts table is not displayed, so again the refresh happens in background.

It's only really a problem on IE, which takes forever to render the table. Chrome and FF (especially FF4) are fine.

best
Roy
Actions
3. Re: How to insert a row in xxxxDataTable

ilya_shaikovsky Jul 22, 2010 4:23 AM (in response to xyzzy07)

I'm not sure if you created something about
I had a lot of problems with rendering of the built-in filtering so in the end just created my own search form outside the table.
I was at vacation so maybe lost some threads.. But in general I still think that you should choose the way of solving such problem and building interface which contains lightweight tables with good filters instead of transmitting all the data to the client.
Actions

4. Re: How to insert a row in xxxxDataTable

neeryck Jul 23, 2010 1:25 PM (in response to ilya_shaikovsky)

Hi,

I have a similar problem!

My page have the following code:

...........
<a4j:region id="region" renderRegionOnly="true" > 
                    <a4j:poll reRender="colum" action="#{bean.test}" interval="1000"/>
 
<rich:dataTable value="#{bean.list}"
                                    var="list" 
                                    id="dataTable" 
                                    rows="10"
                                    ajaxKeys="#{bean.keyToUpdate}">
 
                        <rich:column id="colum">
                            <f:facet name="header">
                                <h:outputText value="Name" />  
                            </f:facet>
                            <h:outputText id="name" value="#{list.name}" />
                        </rich:column>
     ............

The code snippet above do update only the row I want through ajaxKeys. But looking at wireshark(http://www.wireshark.org/) the app receive all XHTML's structure from ajax request! In other words, it send 1150 bytes (depending of update's information) of 1500 total bytes of an IP packet.

Can I send only the information (without XHTML structure) and uptade the dataTable's row?? And if I can't, I wanted to understand why.

Thank's in advance!!

5. Re: How to insert a row in xxxxDataTable

ilya_shaikovsky Jul 26, 2010 3:50 AM (in response to neeryck)

change colum to name in reREnder.
and please do not make similar postings in different threads. I already answered in separate one you created.
Actions

Go to original post