diff --git a/src/Select.js b/src/Select.js index 2cc37307de..a67909c407 100644 --- a/src/Select.js +++ b/src/Select.js @@ -79,6 +79,7 @@ const Select = React.createClass({ simpleValue: React.PropTypes.bool, // pass the value to onChange as a simple value (legacy pre 1.0 mode), defaults to false style: React.PropTypes.object, // optional style to apply to the control tabIndex: React.PropTypes.string, // optional tab index of the control + tabSelectsValue: React.PropTypes.bool, // whether to treat tabbing out while focused to be value selection value: React.PropTypes.any, // initial field value valueComponent: React.PropTypes.func, // value component to render valueKey: React.PropTypes.string, // path of the label value in option objects @@ -120,6 +121,7 @@ const Select = React.createClass({ scrollMenuIntoView: true, searchable: true, simpleValue: false, + tabSelectsValue: true, valueComponent: Value, valueKey: 'value', }; @@ -356,7 +358,7 @@ const Select = React.createClass({ } return; case 9: // tab - if (event.shiftKey || !this.state.isOpen) { + if (event.shiftKey || !this.state.isOpen || !this.props.tabSelectsValue) { return; } this.selectFocusedOption(); diff --git a/test/Select-test.js b/test/Select-test.js index 0ec7b01c01..9276442496 100644 --- a/test/Select-test.js +++ b/test/Select-test.js @@ -2719,6 +2719,25 @@ describe('Select', () => { }); }); + describe('with tabSelectsValue=false', () => { + + beforeEach(() => { + + instance = createControl({ + options: defaultOptions, + tabSelectsValue: false + }); + }); + + it('should not accept when tab is pressed', () => { + + // Search 'h', should only show 'Three' + typeSearchText('h'); + pressTabToAccept(); + expect(onChange, 'was not called'); + }); + }); + describe('valueRenderer', () => { var valueRenderer;