PrimeFaces Ajax Inplace Editor

Lately, PrimeFaces inplace component has been enhanced with ajax editing capabilities, this is quite useful for pages where you’d like handle view/edit use-cases together. So how it works;

<p:inplace editor="true">
    <h:inputText value="#{bean.text}" />
</p:inplace>

View Mode

Edit Mode

Anything can be used as editor, not just inputs or dropdowns, you can use whatever you’ve placed inside inplace component (e.g. textarea, checkbox, radiobuttons and more). Just editor attribute needs to be set true, onEditUpdate attribute is optional specifying what component to update when saving the edited input.

When validation fails, inplace does not toggle back to view mode and stays editable. Also if you don’t like the default controls to save/cancel, you can provide your own controls easily.

See live demo of inplace at PrimeFaces Showcase.

There is also a client side api available providing methods like hide() and show() to toggle between modes.

5 Responses to PrimeFaces Ajax Inplace Editor

  1. Ara Minosian says:

    Is it possible to update browser URL after editing?

  2. James says:

    Superb!!!

  3. Ara Minosian says:

    So AJAX update of browser URL after editing is not possible.
    That is Ok.

  4. Brian Hiles says:

    How do you specify the method to call when the “check” button is clicked? I’m getting no persistence when it is changed.

%d bloggers like this: