How to clear some fields in form - Redux-Form

Tugrul picture Tugrul · May 12, 2016 · Viewed 31.4k times · Source

I'm working on a page which has many input validations and logical bindings on it and every sprint iteration the page size increasing. So that, I have to find a beautiful and scalable solution.

Imagine, when user select a value from dropdown as 'A', some fields must be disabled, some fields must be cleared and some fields initilized with default values. I can change one related field (doesn't have validation rule like regexp or lenght constrait) value with some little code like

  this.props.dispatch(change('xForm','xField','xValue' ))

My problem is that when I need to clear multiple fields,

It always blocked by my validation method and clear operation is failed ( Note : I supposed to be like that but not like that)

.

I tried some strategies as below but y,z,w fields have some text and it triggered validation rule and hanled errors. So that, inputs have still old values, not cleared ones.

    //Clear    
    this.props.dispatch(change('xForm','yField','' ))
    this.props.dispatch(change('xForm','zField','' ))
    this.props.dispatch(change('xForm','wField','' ))

What are the best practises for clear inputs or assign some values to inputs in redux-form for pages which have highly dependent inputs.

I have been researching for 2 days but I couldn't find any optimal solution. (redux normalizer, redux form utils etc.)

Thanks.

Answer

chickenchilli picture chickenchilli · Mar 15, 2017

This worked for me:

resetAdvancedFilters(){
        const fields = ['my','fields','do','reset','properly']
        for (var i = 0; i < fields.length; i++) {
            this.props.dispatch(change('formName',fields[i],null))
            this.props.dispatch(untouch('formName',fields[i]))
        }
    }