title: React Native Material Dropdown - How do you create auto fill/select dropdown base of JSON data structure?
body: <p>I have a structure json like this:</p>
  
  <pre><code>"diagnosis": [{
    "name": "kode",
    "value": [
      {"value": "kode1"},{"value": "kode2"},{"value": "kode3"}
    ]},
    {
    "name": "Primary Category",
    "value": [
      {"value": "PriCat1","id": "kode1"},
      {"value": "PriCat2","id": "kode2"},
      {"value": "PriCat3","id": "kode3"}
    ]},
    {
    "name": "Location",
    "value": [
      {"value": "Loc1","id": "kode1"},
      {"value": "Loc2","id": "kode2"},
      {"value": "Loc3","id": "kode3"}
    ]}
  ]
  </code></pre>
  
  <p>and for now, I can rendering those json with this code:</p>
  
  <pre><code>renderingMenu(){
    var tempListCheckBox = this.state.diagnosis.map(function(item,index){
    let data = item.value;
    return(
      &lt;View&gt;
        &lt;Text style={[global.global.Text, {padding:DeviceWidth*0.02}]}&gt;{item.name} :&lt;/Text&gt;
        {/* https://github.com/n4kz/react-native-material-dropdown */}
        &lt;Dropdown
          dropdownOffset={{top:5}}
          containerStyle={{borderWidth:1, borderColor:'lightgrey', borderRadius:50, width:DeviceWidth*0.8, paddingLeft:DeviceWidth*0.02}}
          rippleCentered={true}
          inputContainerStyle={{ borderBottomColor: 'transparent' }}
          data={data}
          valueExtractor={({value})=&gt; value}
          onChangeText={(value)=&gt;{this.onChangeTextPress(item.name, value)}}
        /&gt;
      &lt;/View&gt;
    )
    }.bind(this))
    return tempListCheckBox;
  }
  </code></pre>
  
  <p>here's the result of my code:</p>
  
  <p><a href="https://i.stack.imgur.com/DrLgM.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/DrLgM.png" alt="Dropdown"></a></p>
  
  <p>But I need to handle when the <code>kode:</code> label already selected with the value <code>kode1</code>, all the rest of dropdown will auto selected, like <code>Primary Category</code> value = <code>PriCat1</code>, and <code>Location</code> value = <code>Loc1</code></p>
  
  <p>Example: </p>
  
  <p><a href="https://i.stack.imgur.com/TWMrw.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/TWMrw.png" alt="Example"></a></p>
  
  <p>I've spent a couple hours to find any code, but still no luck,</p>
  
  <p>anyone have an idea how to do that?</p>
  
  <p>Edited:</p>
  
  <pre><code>onChangeTextPress(key, value){
    this.state.selected[key] = value;
    this.setState({selected: this.state.selected});
    console.log(this.state.selected);
  }
  </code></pre>