CODEWITHSUNDEEP
reactjsreduxredux-form
Saptarshi Dey
Saptarshi Dey

Reputation: 366

Field in redux-form not Editable

const FIELDS = [
{label:'Survey Title', name:'title'},
{label:'Survey Line', name:'subject'},
{label:'Email Body', name:'body'},
{label:'Recipients List', name:'emails'}
]

class SurveyForm extends Component{
    renderFileds(){
        return _.map(FIELDS,({label,name})=>{
           return (
            <Field 
                key={name}
                component={SurveyField}
                type="text"
                label={label}
                name={name}
            />
           ) 
        })

    }
    render(){
        return(
            <div>
                <form onSubmit={this.props.handleSubmit((values)=>console.log(values))}>
                    {this.renderFileds()}
                <button type="submit">Submit</button>
                </form>
            </div>
        )
    }
}

I am using redux-form. Imported Field from redux-form and rendering it this way. All appears fine on screen but when I type on the input field nothis appears. the filed is not editable. Any specific reason why this is happening?

Upvotes: 0

Views: 1649

Answers (1)

Atikur Rahman Sabuj
Atikur Rahman Sabuj

Reputation: 436

It's too late but I faced the same problem and solved it by adding reducer of redux-form library to the combine reducer.

import {combineReducers} from 'redux'
import user from './userReducer'
import {reducer as formReducer} from 'redux-form';
const reducer = combineReducers({
     user,
     form: formReducer,
})
export default reducer

Hope this helps someone.

Upvotes: 3

Related Questions