CODEWITHSUNDEEP
javascriptreactjs
Non
Non

Reputation: 8589

How to get the id of the current item?

I am editing an item which contains some information, once the item is edited, I need to send the new info to the database through a post request.

the object I am working on is named dealer, that dealer has an id, look at the code

if (this.props.dealerData) {
  let dealerProps = this.props.dealerData.dealersData;
  dealerInfo = dealerProps.map((dealer) => {

    return (<div>
          <Card>

            <CardHeader title={dealer.NickName}
                        subtitle={dealer.DealerId} //DEALER ID HERE
                        avatar={dealer.DealerName}/>

              <Button onClick={this._updateDealer} />

          </Card>
        </div>
      );
  })
}

that is the data I am sending to the db with this function

  _updateDealer = () => {
    UpdateDealerActions.updateDealer({
      DealerId   : // HERE I NEED TO SEND THE DEALER ID,
      DealerName : this.refs.DealerNameEdit.getValue(),
      NickName   : this.refs.NickNameEdit.getValue(),
    });
  }

let me explain: you have that collection of items being render here with dealerInfo, there is like 30 items/dealers. The DealerId is not editable, it is just something you need to send to the DB in order to know which dealer you are editing.

So, in my function _updateDealer(), which is the best method to catch the DealerId ?

EDIT

this is the part of the code where I am editing with the refs

<Checkbox value="Active" ref="Active" defaultChecked={true}/>
<TextField ref="DealerNameEdit" value={this.state.toEdit.DealerName} onChange={this._handleUpdateChange.bind(this, 'DealerName')} />
<TextField ref="CardIdEdit" value={this.state.toEdit.CardId} onChange={this._handleUpdateChange.bind(this, 'CardId')} />
<TextField ref="NickNameEdit" value={this.state.toEdit.NickName} onChange={this._handleUpdateChange.bind(this, 'NickName')} />
<TextField ref="LegalIdEdit" value={this.state.toEdit.LegalId} onChange={this._handleUpdateChange.bind(this, 'LegalId')} />
<TextField ref="TypeIdEdit" value={this.state.toEdit.TypeId} onChange={this._handleUpdateChange.bind(this, 'TypeId')} />

Upvotes: 1

Views: 223

Answers (1)

Jonathan
Jonathan

Reputation: 1241

You could bind the id to the click handler.

     <Button onClick={this._updateDealer.bind(this, dealer.DealerId)} />

And then in your handler

_updateDealer = (DealerId) => {
    UpdateDealerActions.updateDealer({
    DealerId   : DealerId,
    DealerName : this.refs.DealerNameEdit.getValue(),
    NickName   : this.refs.NickNameEdit.getValue(),
  });
}

another solution should be:

<TextField ref="DealerIdEdit" value={this.state.toEdit.DealerId} />

and in the _updateDealer()

DealerId   : this.refs.DealerIdEdit.getValue()

Upvotes: 1

Related Questions