title: values not storing to board if i edit the value
body: <p>If i click on edit button, try to change the value and after saving the value, It's changing the value in localhost but not updating in board. [In the image shows todo app, If i add the data in input field, the values entered is storing in board and if i delete, values are deleting. But, if i click on edit, values are changing in localhost but not in board][1] Please help me to find the right solution.</p>
  <pre><code>import mondaySdk from &quot;monday-sdk-js&quot;;
  import &quot;monday-ui-react-core/dist/main.css&quot;;
  import { BrowserRouter,Route,Routes } from &quot;react-router-dom&quot;;
  import Update from &quot;./Update&quot;;
  import { Link } from &quot;react-router-dom&quot;;
  import EdiText from 'react-editext'
  
  const monday = mondaySdk();
  
  class Todo extends React.Component {
    constructor(props) {
      super(props)
      
      this.state = {
        settings: {},
        name: '',
        nameError:'',
        dataDelete:[],
        nameBlank:false,
        arrayData:[],
        page:1,
        totalPagination:0
      };
    }
  
    componentDidMount() {
      monday.listen(&quot;settings&quot;, res =&gt; {
        this.setState({
          settings:{
            backgroundColor:res.data.backgroundColor
          }
        })
      });
  
    }
  
    onClickDelete=(itemId)=&gt;{
      const query = 'mutation{ delete_item (item_id: '+itemId+') { id }}';    
      fetch (&quot;https://api.monday.com/v2&quot;, {
        method: 'post',
        headers: {
          'Content-Type': 'application/json',
          'Authorization' : 'eyJhbGciOiJIUzI1NiJ9.eyJ0aWQiOjE0MTE3NTM5NSwidWlkIjoyNzA5Mzk2NCwiaWFkIjoiMjAyMi0wMS0xN1QxMzoyNzo0My4wMDBaIiwicGVyIjoibWU6d3JpdGUiLCJhY3RpZCI6NzYxMzc0MywicmduIjoidXNlMSJ9.pg_vHeW_LBGr4FANVSfS9bc2QJI--q0NFDv2sODlufM'
         },
         body: JSON.stringify({query:query})
        })
    }
  
    componentDidMount(){
      let query = '{boards(limit:100) { name id items { name column_values{title id text } } } }';
      fetch (&quot;https://api.monday.com/v2&quot;, {
        method: 'post',
        headers: {
          'Content-Type': 'application/json',
          'Authorization' : 'eyJhbGciOiJIUzI1NiJ9.eyJ0aWQiOjE0MTE3NTM5NSwidWlkIjoyNzA5Mzk2NCwiaWFkIjoiMjAyMi0wMS0xN1QxMzoyNzo0My4wMDBaIiwicGVyIjoibWU6d3JpdGUiLCJhY3RpZCI6NzYxMzc0MywicmduIjoidXNlMSJ9.pg_vHeW_LBGr4FANVSfS9bc2QJI--q0NFDv2sODlufM'
        },
        body: JSON.stringify({
          'query' : query
        })
      })
      .then(res =&gt; res.json())
      // .then(res=&gt;console.log(res.data.boards))
      .then(res=&gt;res.data.boards.map((dataValue)=&gt;{
        if(dataValue.name==='Todo Board')
        {
          var itemLength=dataValue.items.length
          // console.log(dataValue)
          this.setState({
            arrayData:res.data.boards,
            totalPagination:itemLength
          })
        }
        
      }))
   }
  
    componentDidUpdate(){
      var currentPage=this.state.page
      let query = '{boards(limit:100) { name id items(limit:10,page:'+currentPage+') { name column_values{title id text } } } }';
      fetch (&quot;https://api.monday.com/v2&quot;, {
        method: 'post',
        headers: {
          'Content-Type': 'application/json',
          'Authorization' : 'eyJhbGciOiJIUzI1NiJ9.eyJ0aWQiOjE0MTE3NTM5NSwidWlkIjoyNzA5Mzk2NCwiaWFkIjoiMjAyMi0wMS0xN1QxMzoyNzo0My4wMDBaIiwicGVyIjoibWU6d3JpdGUiLCJhY3RpZCI6NzYxMzc0MywicmduIjoidXNlMSJ9.pg_vHeW_LBGr4FANVSfS9bc2QJI--q0NFDv2sODlufM'
        },
        body: JSON.stringify({
          'query' : query
        })
      })
        .then(res =&gt; res.json())
        .then(res=&gt;this.setState({arrayData:res.data.boards}))
    }
  
    onChangeName=(event1)=&gt;{
      this.setState({
        name:event1.target.value,
        nameBlank:false
      })
    }
  
    onValidation()
    {
      const {name}=this.state
      if(name===&quot;&quot;)
      {
        this.setState({
          nameBlank:true
        })
      }
      else if(name.length&lt;3)
      {
        this.setState({
          nameError:&quot;Enter the name above 3 characters&quot;,
        })
      }
      
      else
      {
        this.onStoreDataToBoard();
      }
      
    }
  
    onStoreDataToBoard()
    {
      let query = 'mutation ($myItemName: String!, $columnVals: JSON!) { create_item (board_id:2171185233, item_name:$myItemName, column_values:$columnVals) { id } }';
        let vars = {
          &quot;myItemName&quot; : this.state.name,
          &quot;columnVals&quot; : JSON.stringify({  
          })
        };
              fetch (&quot;https://api.monday.com/v2&quot;, {
          method: 'post',
          headers: {
              'Content-Type': 'application/json',
              'Authorization' : 'eyJhbGciOiJIUzI1NiJ9.eyJ0aWQiOjE0MTE3NTM5NSwidWlkIjoyNzA5Mzk2NCwiaWFkIjoiMjAyMi0wMS0xN1QxMzoyNzo0My4wMDBaIiwicGVyIjoibWU6d3JpdGUiLCJhY3RpZCI6NzYxMzc0MywicmduIjoidXNlMSJ9.pg_vHeW_LBGr4FANVSfS9bc2QJI--q0NFDv2sODlufM'
          },
          body: JSON.stringify({
              'query' : query,
              'variables' : JSON.stringify(vars)
          })
          })
    }
  
    onSave = (itemVal) =&gt; {
      let query = 'mutation ( $myItemName: String!) { change_simple_column_value (board_id:2171185233, item_id:2192899865, column_id:name, value:$myItemName) { id } }';
      let vars = {
        &quot;myItemName&quot; : this.state.name,
        // &quot;columnVals&quot; : JSON.stringify({
        //   &quot;name&quot; :this.state.name,
        // })
      };
      fetch (&quot;https://api.monday.com/v2&quot;, {
        method: 'post',
        headers: {
          'Content-Type': 'application/json',
          'Authorization' : 'eyJhbGciOiJIUzI1NiJ9.eyJ0aWQiOjE0MTE3NTM5NSwidWlkIjoyNzA5Mzk2NCwiaWFkIjoiMjAyMi0wMS0xN1QxMzoyNzo0My4wMDBaIiwicGVyIjoibWU6d3JpdGUiLCJhY3RpZCI6NzYxMzc0MywicmduIjoidXNlMSJ9.pg_vHeW_LBGr4FANVSfS9bc2QJI--q0NFDv2sODlufM'
        },
        body: JSON.stringify({
          'query' : query,
          'variables' : JSON.stringify(vars)
        })
      })
      .then(res =&gt; res.json()) 
      .then(res =&gt; console.log(JSON.stringify(res, null, 2)));
  }
  
    onClickButton=()=&gt;{
      this.onValidation()
    }
  
    render() {
      const {nameBlank,nameError}=this.state
      return (
        &lt;div&gt;
        &lt;div className=&quot;DetailsData&quot; style={{background:this.state.settings.backgroundColor,display:'block',padding:'10px'}}&gt;
          &lt;br/&gt;
          &lt;div className=&quot;Createinside&quot;&gt;
          &lt;h1&gt;Todo List&lt;/h1&gt;
          &lt;label&gt;Add Todo: &lt;/label&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;
          &lt;input type=&quot;text&quot; name=&quot;name&quot; onChange={(event1)=&gt;this.onChangeName(event1)}/&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;
          &lt;button style={{backgroundColor:'orange'}} onClick={this.onClickButton}&gt;Submit&lt;/button&gt;
          {
            nameBlank?&lt;p&gt;Enter the Todo Name&lt;/p&gt;:null
          }
          &lt;div&gt;{nameError}&lt;/div&gt;
          &lt;br/&gt;
          &lt;br/&gt;
          &lt;/div&gt;
        &lt;/div&gt;
        &lt;div&gt;
        &lt;table className=&quot;center&quot;&gt;
              &lt;tr&gt;
                &lt;th&gt;ID&lt;/th&gt;&amp;nbsp;
                &lt;th&gt;Name&lt;/th&gt;
              &lt;/tr&gt;
              &lt;tr&gt;
                &lt;td&gt;
                  {
                  this.state.arrayData.map((value,index)=&gt;{
                  return (
                  &lt;div key={index}&gt;
                    {value.name==='Todo Board'?
                      &lt;div&gt;
                        {
                         value.items.map((itemVal,index)=&gt;{
                          return (
                          &lt;div key={index}&gt;
                            {
                              itemVal.column_values.map((columnVal,index)=&gt;{
                              return (
                              &lt;div key={index}&gt;
                                {
                               columnVal.title==='Item ID'?
                                &lt;div&gt;
                                  &lt;p className=&quot;gettingValue&quot;&gt;{columnVal.text}&lt;/p&gt;
                                  
                                &lt;/div&gt;:null
                                }
                              &lt;/div&gt;
                              )
                              })
                            }
                         &lt;/div&gt;
                          )
                       })
                     }
                  &lt;/div&gt;:null
                     }
                 &lt;/div&gt;
                   )
                  })
                  }
                &lt;/td&gt;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;&amp;nbsp;
                &lt;td&gt;
                {
                this.state.arrayData.map((value,index)=&gt;{
                return (
                &lt;div key={index}&gt;
                   {
                   value.name==='Todo Board'?
                   &lt;div&gt;
                    {value.items.map((itemVal,index)=&gt;{
                         return (
                         &lt;div key={index}&gt;
                         {/* &lt;p className=&quot;gettingValue&quot;&gt;{itemVal.name}&lt;/p&gt; */}
                                  &lt;EdiText className=&quot;gettingValue&quot;
                                    type='text'
                                    editButtonContent='Edit'
                                    value={itemVal.name}
                                    onSave={this.onSave(itemVal.text)}
                                  /&gt;
                         &lt;/div&gt;
                       )
                    })}
                    &lt;/div&gt;:null
                        }
                   &lt;/div&gt;
                    )
                  })
                }
                &lt;/td&gt;
                &lt;td&gt;
                  {
                    this.state.arrayData.map((value,index)=&gt;{
                      return (
                        &lt;div key={index}&gt;
                          {value.name==='Todo Board'?
                            &lt;div&gt;
                           {
                             value.items.map((itemVal,index)=&gt;{
                             return (
                            &lt;div key={index}&gt;
                            {
                              itemVal.column_values.map((columnVal,index)=&gt;{
                              return (
                               &lt;div key={index}&gt;
                                  {
                                   columnVal.title==='Item ID'?
                                  &lt;div&gt;
                                   &lt;p className=&quot;gettingValue&quot;&gt;
                                   &lt;button style={{background:'yellow'}} onClick={()=&gt;this.onClickDelete(columnVal.text)}&gt;Delete&lt;/button&gt;
                                   &lt;/p&gt;
                                &lt;/div&gt;:null
                                }
                               &lt;/div&gt;
                                 )
                               })
                             }
                           &lt;/div&gt;
                           )
                           })
                         }
                        &lt;/div&gt;:null
                          }
                        &lt;/div&gt;
                      )
                    })
                  }
                &lt;/td&gt;
                &lt;/tr&gt;
                &lt;/table&gt;     
        &lt;/div&gt;
        &lt;/div&gt;
      )
    }
  }
  export default Todo;```
  
  
    [1]: https://i.stack.imgur.com/6Tpma.png
  </code></pre>