React component for label edition on the fly. Label changes in material text field after click.
View the Project on GitHub maciejsikora/react-material-editlabel
| Property | Type | Description |
| input | object | Properties transferred to TextField or input ( depends from material prop ). Check props in TextField - TextField |
| label | object | Properties transferred to label element. |
| initBy | string | Possible options are: EditLabel.INIT_CLICK or EditLabel.INIT_DBCLICK. Option defines edit starts after single or double click. |
| id | number (REQUIRED) | It is identificator of component. Must be set and be different from other EditLabels |
| defValue | string | Default start value on label |
| clearEnable | bool | Default is false. If true it will allow to clear value. |
| material | bool | Default is true. If false it will use standard input field. |
| onChange | function(value,id) | Is called on every text change. |
| onEditStart | function(value,id) | Is called on edition start. |
| onEditEnd | function(value,id) | Is called on edition end. |
| onEnterClick | function(value,id) | Is called on enter key clicked on field. |
<EditLabel onEditStart={this.onEditStart.bind(self)} onChange={this.onChange.bind(this)} onEditEnd={this.onEditEnd.bind(this)} defValue={this.defText} id={this.editLabelId} />
Component requires to work TextField from material ui - Material ui
Author of component is Maciej Sikora - @maciejsikora. Script is on MIT licence.
All my social profiles can be find on my blog - maciejsikora.com