diff --git a/src/typeahead/index.js b/src/typeahead/index.js index e20c2467..00bd9302 100644 --- a/src/typeahead/index.js +++ b/src/typeahead/index.js @@ -16,6 +16,11 @@ var fuzzy = require('fuzzy'); var Typeahead = React.createClass({ propTypes: { customClasses: React.PropTypes.object, + CustomComponent: React.PropTypes.oneOfType([ + React.PropTypes.func, + React.PropTypes.string + ]), + inputQuerySel: React.PropTypes.string, maxVisible: React.PropTypes.number, options: React.PropTypes.array, allowCustomValues: React.PropTypes.number, @@ -29,6 +34,8 @@ var Typeahead = React.createClass({ return { options: [], customClasses: {}, + CustomComponent: "input", + inputQuerySel: "input", allowCustomValues: 0, defaultValue: "", placeholder: "", @@ -62,7 +69,7 @@ var Typeahead = React.createClass({ }, setEntryText: function(value) { - this.refs.entry.getDOMNode().value = value; + this.refs.container.getDOMNode().querySelector(this.props.inputQuerySel).value = value; this._onTextEntryUpdated(); }, @@ -104,7 +111,7 @@ var Typeahead = React.createClass({ }, _onOptionSelected: function(option, event) { - var nEntry = this.refs.entry.getDOMNode(); + var nEntry = this.refs.container.getDOMNode().querySelector(this.props.inputQuerySel); nEntry.focus(); nEntry.value = option; this.setState({visible: this.getOptionsForValue(option, this.props.options), @@ -114,7 +121,7 @@ var Typeahead = React.createClass({ }, _onTextEntryUpdated: function() { - var value = this.refs.entry.getDOMNode().value; + var value = this.refs.container.getDOMNode().querySelector(this.props.inputQuerySel).value; this.setState({visible: this.getOptionsForValue(value, this.props.options), selection: null, entryValue: value}); @@ -185,8 +192,8 @@ var Typeahead = React.createClass({ var classList = React.addons.classSet(classes); return ( -