Possible to retrieve the index along with data from handleSubmit(onSubmit)?

[michaeljblum]

I've got a dropdown (select/option) whose items are dynamically generated with data. Like so:

<form onChange={handleSubmit(onSubmit)}>
          <select className="buttons" ref={register} name="dropdown">
            {lists.map((item, index) => {
              return <option key={index}>{Object.keys(item)}</option>;
            })}
          </select>
</form>

(I know I shouldn't be setting the key as index - changed it from actual val for this example)

I'd like to retrieve the index of the <option> element as well as the content/data. Is this possible? I've looked into RHF docs but couldn't find anything.

Any help would be super appreciated, thanks (and thanks for this awesome library!!!)

[bluebill1049]

1. I think you probably want to build a custom component with does provide index & value and then use Controller to collect value
2. use custom register at useEffect and setValue at onChange

[michaeljblum]

Thanks for the quick response! Seems a little more trouble than it's worth for my given situation, will probably just use discrete buttons, but good to know for the future.