InplaceInput is a simple input component which displays current value as outputText and switches to inputText based representation after defined event to allow edit this value.

You could try two simplest examples below. For the first demo - just click on label to edit the value and click somewhere outside the component to store this value(Or just press ENTER button).

Second example has controls for components enabled with showControls attribute. These controls should be used in order to apply value or cancel editing.

Inplace Input could be rendered with span or div elements to display its value. To change default span output use layout attribute with block value.

Next example shows you Inplace Input component usage in dataTable. Custom event fired on saving value used in this example to perform Ajax validation for the value entered.