diff --git a/src/CellEditContainer.js b/src/CellEditContainer.js index aa2b675..5091c1f 100644 --- a/src/CellEditContainer.js +++ b/src/CellEditContainer.js @@ -23,8 +23,9 @@ class CellEditContainer extends React.Component { // console.log(this.node.focus) if (this.node && this.node.focus) { this.node.focus() - if (this.node.setSelectionRange) { - this.node.setSelectionRange(0, this.node.value.length) + if (this.node.select) { + this.node.select() + // this.node.setSelectionRange(0, this.node.value.length) } } } diff --git a/src/Grid.js b/src/Grid.js index 3b28d74..d5ec51d 100644 --- a/src/Grid.js +++ b/src/Grid.js @@ -938,7 +938,7 @@ class Grid extends React.PureComponent { width: header.width, [COL_IDENT_ATTRIBUTE]: header.ident, onClick: this.props.sortEnabled ? this.columnHeaderClick : undefined, - sortOrder: this.props.sortEnabled ? sortOrderOf(header)(this.state.sortOptions) : undefined, + sortOrder: this.props.sortEnabled ? sortOrderOf(header)(this.sortOptions()) : undefined, 'data-column-index': index, ...rest, }) diff --git a/src/RowEditor.js b/src/RowEditor.js index 834b130..cfc8b55 100644 --- a/src/RowEditor.js +++ b/src/RowEditor.js @@ -156,8 +156,9 @@ class RowEditor extends React.Component { if (!prevProps.isEditing && this.props.isEditing) { if (this.focusNode) { if (this.focusNode) this.focusNode.focus() - if (this.focusNode.setSelectionRange) { - this.focusNode.setSelectionRange(0, this.focusNode.value.length) + if (this.focusNode.select) { + this.focusNode.select() + // this.focusNode.setSelectionRange(0, this.focusNode.value.length) } } // eslint-disable-next-line react/no-did-update-set-state diff --git a/src/stories/data.js b/src/stories/data.js index 46767f3..23444b4 100644 --- a/src/stories/data.js +++ b/src/stories/data.js @@ -54,7 +54,7 @@ const unitDataFormatter = ({ value }) => unitMap[value] || value /* prettier-ignore */ export const headers = [ - dateCol({ ident: 'transDate', display: 'Trans-Date', width:120, isKey:true, }), + dateCol({ ident: 'transDate', display: 'Trans-Date', width:140, isKey:true, }), strCol({ ident: 'unitId', display: 'Unit', width:180, isKey:true, dataFormatter:unitDataFormatter,choices:unitChoices , acceptRawText : true , setInvalidMessage : ({value}) => !unitMap[value] && value !== 'prakash' && 'Please Enter Valid Data.' }), intCol({ ident: 'he', display: 'HE', width: 40,isKey:true, numFormat:"0", }), diff --git a/src/stories/virtualized/virtualized.stories.js b/src/stories/virtualized/virtualized.stories.js index 0b20a72..b7e45e7 100644 --- a/src/stories/virtualized/virtualized.stories.js +++ b/src/stories/virtualized/virtualized.stories.js @@ -9,6 +9,7 @@ import Grid, { VirtualizedCell, } from '../../index' import { createData, headers } from '../data' +import { CellInputEditor } from '../../Components' const customizedCellRender = params => { const { gridToolProps, reactVirtualizedProps, ...rest } = params @@ -54,9 +55,29 @@ const customizedCellRender = params => { return defaultVirtualizedCellRender(params) } +export const dateInputCellEditRender = ({ getInputProps }) => ( + +) + const data = createData(200) storiesOf('Virtualized grid', module) - .add('Basic', () => ) + .add('Basic', () => ( + { + const type = props.gridToolProps.headers[props.reactVirtualizedProps.columnIndex].type + return defaultVirtualizedCellRender({ + ...props, + editRender: (type === 'date-time' || type === 'date') && dateInputCellEditRender, + }) + }, + })} + editMode="cell" + isEditable={() => true} + /> + )) .add('Fixed Col and Free edit', () => ( cols.map(c => c.width).reduce((c1, c2) => c1 + c2) +const totalColWidth = cols => cols.map(c => c.width).reduce((c1, c2) => c1 + c2, 0) const colWidthOf = cols => ({ index }) => cols[index].width