Select to view content in your preferred language

calcite-dropdown-item deprecated 'active' property

418
2
08-18-2022 12:15 PM
GregoryBologna
Frequent Contributor

If I change 'active' to 'open' for this deprecated property, selectedItems is empty.

https://developers.arcgis.com/calcite-design-system/components/dropdown/

GregoryBologna_0-1660849534068.png

Creating dynamic dropdown

 

let opt_item = document.createElement('calcite-dropdown-item');
opt_item.setAttribute('id', 'pao-unit-feet');
opt_item.setAttribute('active', '');
opt_item.setAttribute('data-unit-abrv', 'ft');
opt_item.innerHTML = 'Feet';
grp.appendChild(opt_item);

 

 

OK Use opt_item.setAttribute('active', '');

GregoryBologna_4-1660849848398.png

Change to opt_item.setAttribute('open', '');

GregoryBologna_3-1660849791127.png

 

0 Kudos
2 Replies
KittyHurley
Esri Contributor

Hi @GregoryBologna, the calcite-dropdown deprecated the "active" property, in favor of "open" as you mentioned. However, the calcite-dropdown-item still uses the "active" property to indicate whether the component is selected.

As a side note, calcite-dropdown-item must have a parent calcite-dropdown-group. Not sure if you've already implemented into the code previously, so providing some additional context.

Here's a Codepen sample creating the dropdown items dynamically to the calcite-dropdown-group. When accessed, the accompanying calcite-button, "Get selectedItems" will log calcite-dropdown's "selectedItems" object length to the console.

GregoryBologna
Frequent Contributor

Thanks, Kitty. I had a notion this was the case.

0 Kudos