0

I have dynamic number of textfileds and i saved the values to those textfields in an array. At first the values get populated with data from server using immutability helper but when i want to edit the textfiled it does not change. when I print the values for state the value is changed but textfield does not get updated.

    handleWordChange = (wordID, e) => {
        let me = this;
        me.setState(update(me.state, {finWords: {[wordID]: {$set: e.target.value}}}), () => console.log(me.state.finWords));
    };

for (let i = 0; i < data.length; i++)
     for (let word in data[i])
         if (data[i].hasOwnProperty(word)) {
            me.setState(update(me.state, {finWords: {$push: [data[i][word]]}}));
            rows.push(
                <Card key={i}>
                    <CardContent>                               
                       <TextField
                           name={"fin-word"+i}
                           value={me.state.finWords[i]}
                           onChange={(e) => me.handleWordChange(i, e)}
                       />
                    </CardContent>
                </Card>
              );
           }
milushka bambalushka
  • 1
  • 1
  • Welcome to Stack Overflow milushka! Please create a [Minimal, Complete, and Verifiable example](https://stackoverflow.com/help/mcve) so that it will be easier for someone to help you. – Tholle Apr 16 '19 at 10:14
  • @milushka - Why are you using me instead of this inside for loop? Have you stored the context inside me? – Peter Apr 16 '19 at 10:22
  • What library is update from? Just a thought, why are you using me in the first place? `this.state` is far more readable than `me` and its not like your saving much with the 2 characters. – Kurtis Apr 16 '19 at 10:35
  • @VishalGulati yes, it is in a callback – milushka bambalushka Apr 16 '19 at 10:36
  • @Kurtis immutability-helper library. its in a callback and I used to write my frontend code with Extjs so me is an old habit. sorry – milushka bambalushka Apr 16 '19 at 10:39
  • I would try and see what prints out in `componentDidupdate` to see if the values are changing inside the component (if this component has some hierarchy). Also are you sure your data structure is correct? `finWords: { [wordID]: { $set: e.target.value } }`. I'm not sure on Immutabillity-Helper but this looks like an object with a property `ID`, this value of that ID is another object, not a string? – Kurtis Apr 16 '19 at 10:52
  • @Kurtis I checked that. state gets updated correctly but the value in textfiled does not change – milushka bambalushka Apr 16 '19 at 11:41
  • Can you create a codepen or small repo I could download and run? – Kurtis Apr 17 '19 at 07:29
  • @Kurtis Thanks. I solved my problem. this part of code was working fine. The problem was my understanding of one way data binding in react – milushka bambalushka Apr 17 '19 at 10:22

0 Answers0