DataTable Cell Editing

These days we are busy with implementing the feature requests from our PrimeFaces PRO users. One such request is inline cell editing similar to excel. Inline row editing is a popular feature of PrimeFaces as it enables to modify data easily, cell editing is similar to this but is enabled by double clicking on a cell. A cell is saved instantly on blur or enter key events. Optional cellEdit event is provided as an ajax behavior to do processing of old-new values on bean side, context menu support is enabled as well for right click options.

Demo is available at PrimeFaces Labs. At the moment, this is a work in progress and we have more work todo before finalizing like multi component support and better visualization of validation errors.

There are many sponsored features for 3.5, keep an eye on this blog for the upcoming goodies.

This entry was posted in JSF. Bookmark the permalink.

16 thoughts on “DataTable Cell Editing

  1. This is a great feature.

    I hope that when the ajax listener is invoked that apart from knowing the old and new values of table column being edited that the Collection used in rendering the table also contains the new value.

    In other words, using your lab example: In “public void onCellEdit(CellEditEvent event)”, Is
    List carsSmall available with the new value?.

    Thanks.

  2. Nice job. But I think that you need to review this behavior:
    - Remove the value in any cell (do not modify the value, only remove it, the cell now is empty), repeat this action is several cells, then several textbox are shown to user, I think that this is not a correct behavior.

    - In one cell where the value is a number writes any letter, one validation is shown, but now I forgot the current value, I want to press “ESC” in order to retrieve the old value, right now this is not possible.

  3. Nice addition. I would like to see how the datatable’s peformance is if we have calendar object as one of the editable cells. Coz with 3.3.1 it i very slow if you have a datatable with input elements spl. calender objects.

    • That’s not a good idea, calendar would be duplicated until we find a way for cells to share same calendar instance so avoid that at the moment.

  4. Good work PF Team….In some scenarios Direct cell editing will be better than entire rowEdit.
    It’s Looking like to preserve the rowSelection event double click added instead single click.

  5. after editing the cell and click the tab it is not going to next cell editing
    If u provide the future like that it will be helpful for performance wise.

  6. An interesting, and very simple feature to add on a DataTable, and on the Sheet component as well, would be to have a “singleClickEdit” attribute which, with a true value (false default), allow to “edit a cell on a single click” :) instead of classical: first click selection, second click editing… (improved interaction IMPOV…)

  7. Very Nice feature :) Will it work with dynamic columns (p:columns)? Especially if the columns changed during an ajax call before?

  8. Implemented this feature right away, nice that also the old value can be checked so it can be used in sql ‘update where’ statements. The IText and Poi export functions however do not work anymore, will this be solved in the future?

    Best regards,

    peter