# EuiComboBox onChange and options

**URL:** https://discuss.elastic.co/t/euicombobox-onchange-and-options/200529
**Category:** Kibana
**Created:** [September 21, 2019, 1:26pm UTC](https://discuss.elastic.co/t/euicombobox-onchange-and-options/200529 "2019-09-21T13:26:30Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![koyassan](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/koyassan/32/48847_2.png) [@koyassan](https://discuss.elastic.co/u/koyassan)
#### Post date: [September 21, 2019, 1:26pm UTC](https://discuss.elastic.co/t/euicombobox-onchange-and-options/200529/1 "2019-09-21T13:26:31Z")

</div>

Hi guys,

In my use case, I have a Form with 2 EuiComboBox. Both combo boxes can't have the same fields, but have the same options. So when i change one combo box, the options can't show anymore the selected value previously.  
For example:

```
let options = [{"label": "a"}, {"label": "b"}, "{label": "c"}, {"label": "d"}];
let comboBox_1_fields = [];
let comboBox_2_fields = [];

```

In combo box 1 I choose `label "a"`, so:

```
possibleOptions = [{"label": "b"}, "{label": "c"}, {"label": "d"}];
comboBox_1_fields = [{"label": "a"}];
let comboBox_2_fields = [];

```

Then I choose `label b` in combo box 2:

```
possibleOptions = ["{label": "c"}, {"label": "d"}];
comboBox_1_fields = [{"label": "a"}];
let comboBox_2_fields = [{"label": "b"}];

```

Finally, i remove `label a` from combo box 1:

```
possibleOptions = [{"label": "a"}, "{label": "c"}, {"label": "d"}];
comboBox_1_fields = [];
let comboBox_2_fields = [{"label": "b"}];

```

Can anyone help me with this?

---

<div class="post-metadata">

### Author: ![markov00](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/markov00/32/33316_2.png) [@markov00](https://discuss.elastic.co/u/markov00)
#### Post date: [September 24, 2019, 12:13pm UTC](https://discuss.elastic.co/t/euicombobox-onchange-and-options/200529/2 "2019-09-24T12:13:46Z")

</div>

Hi @koyassan  
I'm not sure I understand correctly your question, but seems a bit more a React/JS question than a Kibana one.  
The EuiComboBox works like every other React component, so if keep track of the change using the `onChange` props you can also update the state of parent component removing the selected option from the `possibleOptions` array and re-rendering the form with the updated possible options array

---

<div class="post-metadata">

### Author: ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)
#### Post date: [October 22, 2019, 12:13pm UTC](https://discuss.elastic.co/t/euicombobox-onchange-and-options/200529/3 "2019-10-22T12:13:49Z")

</div>

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.
