diff --git a/src/components/inputtext/InputText.js b/src/components/inputtext/InputText.js index c056b2cc11..0a76eab1bd 100644 --- a/src/components/inputtext/InputText.js +++ b/src/components/inputtext/InputText.js @@ -35,41 +35,21 @@ export class InputText extends Component { } } - onInput(e) { + onInput(event) { let validatePattern = true; if (this.props.keyfilter && this.props.validateOnly) { - validatePattern = KeyFilter.validate(e, this.props.keyfilter); + validatePattern = KeyFilter.validate(event, this.props.keyfilter); } - if(this.props.onInput) { - this.props.onInput(e, validatePattern); - } - - this.updateFilledState(e.target.value); - } - - updateFilledState(val) { - if(val && val.length) - this.inputEl.classList.add('ui-state-filled'); - else - this.inputEl.classList.remove('ui-state-filled'); - } - - componentDidMount() { - let _value = this.props.value || this.props.defaultValue; - - this.updateFilledState(_value); - } - - componentDidUpdate(prevProps, prevState, snapshot){ - if (prevProps.value !== this.props.value) { - this.updateFilledState(this.props.value); + if (this.props.onInput) { + this.props.onInput(event, validatePattern); } } render() { - let className = classNames('ui-inputtext ui-state-default ui-corner-all ui-widget', this.props.className, { - 'ui-state-disabled': this.props.disabled + const className = classNames('ui-inputtext ui-state-default ui-corner-all ui-widget', this.props.className, { + 'ui-state-disabled': this.props.disabled, + 'ui-state-filled': this.props.value && this.props.value.length }); let inputProps = Object.assign({}, this.props); diff --git a/src/showcase/inputtext/InputTextDemo.js b/src/showcase/inputtext/InputTextDemo.js index a5f1206f84..4458fba1fa 100644 --- a/src/showcase/inputtext/InputTextDemo.js +++ b/src/showcase/inputtext/InputTextDemo.js @@ -9,7 +9,9 @@ export class InputTextDemo extends Component { constructor() { super(); this.state = { - value: null + value1: '', + value2: '', + value3: '' }; } @@ -29,17 +31,17 @@ export class InputTextDemo extends Component {
InputText has built-in key filtering support to block certain keys, refer to keyfilte page for more information.
+InputText has built-in key filtering support to block certain keys, refer to keyfilter page for more information.
InputText passes any valid attribute to the underlying input element. Extended properties are as follows;
@@ -179,18 +181,20 @@ export class InputTextDemo extends Component {