Referencing specific input in onFocus form handler

[jaredtibs]

Hi,

I'm running into trouble figuring out how to reference a specific one of my InputFields when the onFocus Form handler is triggered. I tried adding an onFocus function to the the individual InputFields themselves but it's not triggering.

Here's my code:

// I want to know which input field was focused in this function
 handleFormFocus(e, component) {
    console.log("input that is focused")
  }

<Form
   ref='registrationForm'
   onFocus={this.handleFormFocus.bind(this)}
   onChange={this.handleFormChange.bind(this)}>
   <InputField
       ref='email'
       autoFocus={true}
       placeholder={this.state.emailPlaceholder}
       placeholderTextColor='#320D3A'
       style={formStyles.input}
       containerStyle={formStyles.inputContainer} />
   <InputField
       ref='password'
       placeholder={this.state.passwordPlaceholder}
       placeholderTextColor='#320D3A'
       style={formStyles.input}
       containerStyle={formStyles.inputContainer} />
</Form>

Doing the following does not work:

<InputField
       onFocus={() => console.log("password focused")}
       ref='password'
       placeholder={this.state.passwordPlaceholder}
       placeholderTextColor='#320D3A'
       style={formStyles.input}
       containerStyle={formStyles.inputContainer} />

Any help at all would be greatly appreciated. Thanks!

[jaredtibs]

Anyone?

[jaredtibs]

Update:

I was able to find a solution to this thanks to a stack overflow post: http://stackoverflow.com/questions/38651770/how-can-i-get-real-elment-by-node-id-react-native

The code I used:

handleFormFocus(e, component) {
  let targetComponent = ReactNativeComponentTree.getInstanceFromNode(component);
  let inputRef = targetComponent._currentElement.props.fieldRef;
  switch (inputRef) {
    // now i can perform actions depending on what input field specifically was focused
  }
}

Cheers

[skizzo]

PS: The require line for ReactNativeComponentTree can look like this:

var ReactNativeComponentTree = require('react/lib/ReactNativeComponentTree');