Expand my Community achievements bar.

Enhance your AEM Assets & Boost Your Development: [AEM Gems | June 19, 2024] Improving the Developer Experience with New APIs and Events

deleteItem on selectedIndex only deletes first Item in listbox


Level 1

Hello. I am trying to create listbox that will be populated by entries from a numeric field using a button. I will have 3 buttons. An 'Add Item' button, a 'Remove Selected Item' button and a 'Clear All Items' button. I have having difficulty with the 'Remove Selected Items' button.

On the click event for the remove button, I have written some simple javascript code to delete the selected index item that should read the selected item from the listbox and then delete it.


This isn't happening. I have noticed that, when I click on my item in the list box, it gets highlighted in blue. When I go and subsequently click on the remove button, all of a sudden, all of the items in the listbox gets highlighted and then the first item in the list gets removed regardless of which items I had chosen. My feeling is, that the all the items in the listbox is getting selected when I press the button and so some sort of default behavior of the selectedItem method makes it grab the first item in the list. I ahve no other code on that button nor do I have any code for the listbox at all.

Not sure if I am setting up my button properly. maybe this is not the right function? Has anyone experienced this behavior?

Couple other things worth noting. The list box is empty. I do not pre-populate it with default items.

I tested the remove button by adding some default items to the list and then selecting one and then clicking the button. This seems to work so I am not sure why my user driven data is different from default data.

3 Replies


Level 7

The code you have shown is the same code i have used and it works to remove a selected item. I have made something similar in testing with populating a listbox using a field and add button/remove buttons. Not sure why it would not be working.

Maybe it is just how it is written for the post, but you are missing the semicolon at the end of the line.


Level 10


Can you show us the code you have in the 'Add Item' button.  I assume this is using the addItem() method, but what are you using as the second parameter, or are you letting it default.  This is the 'rawValue' and must be unique across all items in the list.  If you select an item then all items with the same value will be selected and selectedIndex will return the value of the first one.  Sounds a bit similar to your problem?




Level 7

My add item button is adding an item to the list box based on what is in a textfield. Use unique names for all fields to make referencing them easier, but you can resolveNode as well for referencing objects.

btnAdd: click (Javascript)


I also made a get from listbox button which returns the selected item to a textfield

btnGet: click (Javascript)

TextField2.rawValue = ListBox1.rawValue;

Removing as before

btnRemove: click (Javascript)