I have two dropdowns. One is to call basemap and another to call a custom widget
<calcite-dropdown label="Dropdown label">
<calcite-button slot="dropdown-trigger">Tools</calcite-button>
<calcite-dropdown-group selection-mode="single">
<calcite-dropdown-item label="thebasemaps" id='thebasemaps'>Basemaps</calcite-dropdown-item>
<calcite-dropdown-item label="X" id='X'>X widget</calcite-dropdown-item>
</calcite-dropdown-group>
So I have the addeventlistener:
document.querySelector("calcite-dropdown-item").addEventListener("click", handleWidgetsClick);
So, when I click on the Basemaps, it displays the basemaps gallery with no issues. When I click on the X widget, no reaction. The handlewidgets is not triggered.
Why the addlistener is not triggered for the X widget?
Solved! Go to Solution.
I don't see any documented events for dropdown-item, but dropdown does have a few events you should try out. I think calciteDropdownSelect probably give you what you're looking for via the selectedItems property.
I don't see any documented events for dropdown-item, but dropdown does have a few events you should try out. I think calciteDropdownSelect probably give you what you're looking for via the selectedItems property.