diff --git a/components/table/TableRow.js b/components/table/TableRow.js index 24e59ff2..2ddf4c79 100644 --- a/components/table/TableRow.js +++ b/components/table/TableRow.js @@ -79,11 +79,11 @@ const factory = (Checkbox) => { if (inputType === 'text') { return (
- {inputValue} -
+ onInput={this.handleInputChange.bind(null, index, key, inputType)} + /> ); } diff --git a/lib/table/TableRow.js b/lib/table/TableRow.js index fe751cf8..460c7886 100644 --- a/lib/table/TableRow.js +++ b/lib/table/TableRow.js @@ -43,8 +43,21 @@ var factory = function factory(Checkbox) { args[_key] = arguments[_key]; } - return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_ref = TableRow.__proto__ || Object.getPrototypeOf(TableRow)).call.apply(_ref, [this].concat(args))), _this), _this.handleInputChange = function (index, key, type, event) { - var value = type === 'checkbox' ? event.target.checked : event.target.value; + return _ret = (_temp = (_this = _possibleConstructorReturn(this, (_Object$getPrototypeO = Object.getPrototypeOf(TableRow)).call.apply(_Object$getPrototypeO, [this].concat(args))), _this), _this.handleInputChange = function (index, key, type, event) { + var value = void 0; + switch (type) { + case 'checkbox': + value = event.target.checked; + break; + // Handle contentEditable + case 'text': + value = event.target.textContent; + break; + default: + value = event.target.value; + break; + } + var onChange = _this.props.model[key].onChange || _this.props.onChange; onChange(index, key, value); }, _temp), _possibleConstructorReturn(_this, _ret); @@ -99,6 +112,16 @@ var factory = function factory(Checkbox) { var inputType = _utils2.default.inputTypeForPrototype(this.props.model[key].type); var inputValue = _utils2.default.prepareValueForInput(value, inputType); var checked = inputType === 'checkbox' && value ? true : null; + + if (inputType === 'text') { + return _react2.default.createElement('div', { + children: inputValue, + contentEditable: true, + suppressContentEditableWarning: true, + onInput: this.handleInputChange.bind(null, index, key, inputType) + }); + } + return _react2.default.createElement('input', { checked: checked, onChange: this.handleInputChange.bind(null, index, key, inputType), @@ -145,4 +168,4 @@ var factory = function factory(Checkbox) { return TableRow; }; -exports.default = factory; +exports.default = factory; \ No newline at end of file