Abhi Singh
Abhi Singh

Reputation: 217

Pass multiple parameters to Onchange in picker dropdown

  let makeSubfuel =this.state.data.map((subfuel) => 
  {
     return <Picker.Item label= {subfuel.name} value= {subfuel.id} key= {subfuel.price}/>
  })


  <Form>
    <Picker style={{ width :'90%' ,borderRadius: 10,borderWidth: 3,borderColor: 'black'}}
            mode="dropdown"
            selectedValue={this.state.subfuelid}
            onValueChange={(value,key,label) =>
            {                   
                this.setState({subfuelid: value})
                //ToastAndroid.show("models id is "+ value+"price "+price+"label.."+label, ToastAndroid.LONG);
            }
            }>

    <Picker.Item label="Select Fuel Type" value="key0" />
            {makeSubfuel}
    </Picker>
  </Form>

In above code I am fetching data from server and showing in dropdown picker. I stored id name and price of subfuel while making item for label of dropdown. Now on click i want to know all the three values i.e. id name and price of specific entry but it shows undefined for name and same value for price and value. Why? What I am doing wrong here?

Upvotes: 0

Views: 837

Answers (1)

Andrew
Andrew

Reputation: 28539

From the documentation onValueChange returns value and index in its back. https://facebook.github.io/react-native/docs/picker

onValueChange={(itemValue, itemIndex) => { 
  //do something here 
}

If you want to get the key, value and label you should look them up from the data that you are providing to the Picker. You should be able to use the index with this.

Though you are including an initial picker item that isn’t included in your data so you may have to adjust the index by one to get access to the correct value.

onValueChange={(itemValue, itemIndex) => { 
  let item = this.state.data[itemIndex]
  // now do something here 
}

Upvotes: 1

Related Questions