I have a project that I'm needing to incorporate a slider to allow a user to select a range of configurations. I can use the slider and get it to work, but I need to have several sliders on a single form and the only thing that is returned with the onChange event is the number or the range of numbers for a slider of type range. Does anyone know how to name these?
I just figured out how to handle this. Before, I was passing in the event doing this:
onChange={(event) => {this.handleVolumeChange(event)}}
The issue with this is that the event that is fired is a mouse event and it doesn't have the information needed on the event.target.value like I'm used to using for other form inputs, etc. The solution is to do this:
onChange={(value) => {this.handleVolumeChange(value, 'volume-slider')}}
By passing a different argument than event, I was able to get the value and also pass in a for the slider. Now I will be able to have dynamic adding and removing on the form and handle which slider needs it's information updated. Hope this helps someone else!