Quantcast
Channel: Active questions tagged html - Stack Overflow
Viewing all articles
Browse latest Browse all 72443

How can I set default value of an input within a wizard in Redux form?

$
0
0

I'm new in react and redux so I am puzzled with how to make my situation work.

What I'm trying to achieve is on the first step of the wizard there will be a radio button when clicked, it will set a value for a dropdown on the next step. the fields affected will be a country list which if selected on the first step it will be selected on the next, the other one is if an adult selection is made it will set the age range (dropdown list) from 18-99 years of age.

The code is pretty much the same as this https://redux-form.com/8.2.2/examples/wizard/ instead i'm dealing with dropdown list for setting the default value.

<Field name="age_from" placeholder="Select age from" validate={ [validate.required] } onChange={this.onChangeAgeFrom} component={SelectComponent} options={this.state.ageFromOptions} />
===========================================================
    onChangeAgeFrom = (value, newValue) => {
        console.log('>', newValue, value);
        this.setState({
          ageFrom: newValue,
          ageToOptions: _range(newValue + 1, 100).map(i => ({value: i, label: i}))
        })
      }
======================================================
    {page === 1 && <General 

                        onSubmit={this.nextPage} labels={labels} />}

                    {page === 2 && (
                        <ProfileForm 
                            projectId={projectId}
                            previousState={location.state}
                            ageCategory={this.state.ageCategory}
                            previousPage={this.previousPage}
                            location={location}
                            onSubmit={this.nextPage} />
                    )}
========================================================
    <Field
                        className="styled-checkbox"
                        name="ageCategory"
                        id="is-adult"
                        value="adult"
                        onChange={event => this.onChangeAgeCategory(event.target.value)}
                        component="input"
                        type="radio"
                      />
===================================================
    onChangeAgeCategory = (value) => {
        this.setState({
          ageCategory: value,
          age_from: value == 'adult' ? 18 : 0,
          age_to: value == 'adult' ? 99 : 19
        })
      }

Viewing all articles
Browse latest Browse all 72443

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>