CODEWITHSUNDEEP
reactjsmaterial-ui
htochko
htochko

Reputation: 551

How do get input name changed with material-ui-pickers

On integrating material-ui-pickers from here https://material-ui-pickers.firebaseapp.com/usage with moment.I get only Moment object in my handler on onChange instead of input data with name and value (e.target has name and value in particular input). Could anybody suggest how can I recognize which input has been changed in my form, a have about 10 date inputs in my form?

Upvotes: 3

Views: 2239

Answers (2)

Dmitriy Kovalenko
Dmitriy Kovalenko

Reputation: 3626

You can use also onInputChange prop. It is dispatching updating date by each keystroke

<DatePicker
  onInputChange=((e) => console.log(e.target.value))
/>

Upvotes: 0

Treycos
Treycos

Reputation: 7492

When rendering your inputs, you should pre-configure what will be sent to each change handling functions :

{['A', 'B', 'C',...].map(key => <DatePicker key={key} value={selectedDate} onChange={this.handleDateChange(key)} />}

You can now create a handling function capable of accepting 2 sets of parameters, one for the key, and the other for the event :

handleDateChange = key => date => {
    this.setState({ [key]: date });
};

Now, using computed parameters, you can dynamically set a value in your state without having to know which one in advance.

Upvotes: 1

Related Questions