Text bei onclick editierbar machen bzw. Visibility von Controls schalten

Hallo,

ich möchte die Visibility von Controls per JSF schalten.

Also der Wert description soll als “normaler” Text ausgegeben werden. Das mache ich so:

<h:outputText id="description_" value="#{cc.attrs.description}" /> 

Wenn der Benutzer in den Text klickt, soll er editierbar werden. Es soll quasi das h: outputText Control ausgeblendet werden und das dazugehörige <h:inputText id=“description” value="#{cc.attrs.description}" /> ein. Wenn der <h:inputText den Focus verliert soll hingegen wieder der <h:input angezeigt werden und das <h: inputText auf Visibility Hidden.

Leider unterstützt h: outputText kein <f:ajax>. Gibts da villeicht von den Primfaces was passendes?

warum nimmst du nicht generell einen inputText und stellst nur den Wert von readonly entweder auf true oder false?

Da ich einem input mit der Eigenschaft readonly=„readonly“ nicht mit purem CSS wie einen <h: outputText aussehen lassen kann, würde ich eine andere Lösung vorziehen.

Es geht darum, dass der Bearbeiter des Rezepts schon in etwa sieht, wie das Rezept in der fertigen Version aussieht. Deshalb sollen die Controls die das Rezept bearbeitbar machen, erst angezeigt werden, wenn es erforderlich ist.

Versuch es mal mit einem h:outputLabel, dort ist ajax erlaubt, denn es implementiert das ClientBehaviorHolder-Interface

Wenn es dir erlaubt ist, installier dir einfach Primefaces … dort gibt es sowas schon
http://www.primefaces.org/showcase/ui/inplace.jsf

Ach sehe gerade, du benutzt es schon … ja gibt es :slight_smile:

[QUOTE=JIceman]Wenn es dir erlaubt ist, installier dir einfach Primefaces … dort gibt es sowas schon
http://www.primefaces.org/showcase/ui/inplace.jsf

Ach sehe gerade, du benutzt es schon … ja gibt es :)[/QUOTE]

Danke euch. Kannst du mir auch noch sagen, wie ich den <p:inplace> wieder deaktiviere? Bzw. wenn der Benutzer einmal reinklickt und der input angezeigt wird, soll dieser wieder ausgeblendet werden, wenn er den Fokus verliert oder der Benutzer sonst wo klickt.

Hey, laut docu sollte es wie folgt klappen:

Widget: PrimeFaces.widget.Inplace
Method Params Return Type Description
show() - void Shows content and hides display element.
hide() - void Shows display element and hides content.
PrimeFaces Userʼs Guide
229
Method Params Return Type Description
toggle() - void Toggles visibility of between content and display
element.
save() - void Triggers an ajax request to process inplace input.
cancel() - void Triggers an ajax request to revert inplace input.

Hab es nicht ausprobiert, aber sowas wie
<p:inplace onblur="this.toggle();"/>
könnte funktionieren

Danke dir. Habe das auch noch gefunden http://stackoverflow.com/questions/19198273/hide-inputtext-on-lost-focus-with-pinplace