How to disable primeng multiselect dropdown options of respective multiselect dropdown when a value is changed in a loop

Question

I am using primeng v6.x multiselect inside a table where data rendered dynamically in a loop.

My options array looks as follows:

let data = [
  { key: "ALL", desc: "All", disabled: false },
  { key: "PQR", desc: "Pqr", disabled: false },
  { key: "XYZ", desc: "Xyz", disabled: false }
];

I am passing the above array in [options]="data". I have an add button, when click a new row will be added to the table.

Expected behavior: When select "ALL" option I am changing disabled property to true where it should disable remaining options only in that particular row's dropdown.

Issue: It disables all remaining options in all the table rows including original variable. Please suggest me the solution.

HTML:

<p-multiSelect [options]="data" (onChange)="changeEvent($event)" optionLabel="desc" dataKey="key" [formControl]="dataListControl"></p-multiSelect>

Yes, I am passing a common variable in options. Tried different ways like created new control when adding new row and bind the data into options (not sure if it is correct way), it updates original variable value also. Please suggest how to make optional value unique to specific row.

can you share your html code, I think you are using a common variable in ngmodel binding — Salik Khan, Sep 27 '21 at 14:41
You can use formArray for that or [check this answer](https://stackoverflow.com/a/58921198/12128519) — Salik Khan, Sep 28 '21 at 14:10
I am already using formArray, where control will be a part of formArray. So how can I pass same options in every control in formArray which should act as unique when handling disable options? — Siva Charan, Sep 29 '21 at 11:39

score 0 · Answer 1 · answered Sep 29 '21 at 15:32

if you are using formArray then it should've been working, can you please share your html and ts file, so I can check what's causing the problem, right now you only share the component and it's options, so it's hard to understand. It would be great if you create a stackblitz . thank you

How to disable primeng multiselect dropdown options of respective multiselect dropdown when a value is changed in a loop

1 Answers1