diff --git a/examples/js/cell-edit/custom-cell-edit-table.js b/examples/js/cell-edit/custom-cell-edit-table.js index 04ec16c2e..d645136eb 100644 --- a/examples/js/cell-edit/custom-cell-edit-table.js +++ b/examples/js/cell-edit/custom-cell-edit-table.js @@ -50,7 +50,6 @@ class PriceEditor extends React.Component { ({ (cell || []).join(',') }); +const createPriceEditor = (onUpdate, props) => (); +const createRegionsEditor = (onUpdate, props) => (); + export default class CustomCellEditTable extends React.Component { render() { return ( @@ -131,13 +133,13 @@ export default class CustomCellEditTable extends React.Component { + customEditor={ { getElement: createPriceEditor, customEditorParameters: { currencies: currencies } } }> Product Price + customEditor={ { getElement: createRegionsEditor } }> Regions diff --git a/src/TableEditColumn.js b/src/TableEditColumn.js index e2c75bff2..5848e4483 100644 --- a/src/TableEditColumn.js +++ b/src/TableEditColumn.js @@ -97,12 +97,18 @@ class TableEditColumn extends Component { editable.placeholder && (attr.placeholder = editable.placeholder); const editorClass = classSet({ 'animated': shakeEditor, 'shake': shakeEditor }); - const CustomEditor = customEditor; - const cellEditor = CustomEditor ? : - editor(editable, attr, format, editorClass, fieldValue || ''); + let cellEditor; + if (customEditor) { + const customEditorProps = { + ...attr, + defaultValue: fieldValue || '', + ...customEditor.customEditorParameters + }; + cellEditor = customEditor.getElement(this.handleCustomUpdate, customEditorProps); + } else { + cellEditor = editor(editable, attr, format, editorClass, fieldValue || ''); + } + return ( { cellEditor } @@ -130,6 +136,7 @@ TableEditColumn.propTypes = { PropTypes.string, PropTypes.bool, PropTypes.number, + PropTypes.array, PropTypes.object ]) };