potential bug in listbox event change not triggered

[reblutusBlocked]

I have 2 list boxes, one that has a large list and the second that is to be filled by drag and drop from the first list. I want to listen to event change of the second list to refresh a div. Sometime the event change is not triggered even though it has changed!

I have found that when the drop of the item is done the item is selected in the list. If I click right away on the “x” to remove the item, the change event is not triggered. Additionnally, if I select an item in the list and then click on the “x” to remove it, the change event is not triggered.

I also tried other events (dragEnd change bindingComplete unselect select focus blur) and none are triggered when I follow the repro steps above.

code:

		$("#listBoxA").jqxListBox({ source: messagesDataAdapter, displayMember: "name", valueMember: "id", dropAction:'copy', allowDrop: false, allowDrag: true,  width: 240, height: 425, theme: "s360",
			dragStart: function (item) {
				$("#listBoxB").jqxListBox({dropAction:'copy'});
			}
		});
		$("#listBoxB").jqxListBox({ source: eventMessagesDataAdapter, displayMember: "name", valueMember: "id", dropAction:'copy', allowDrop: true, allowDrag: true, width: 240, height: 425, theme:"s360",
			dragStart: function (item) {
				$("#listBoxB").jqxListBox({dropAction:'default'});
			},
			renderer: function (index, label, value) {
				var img = '<i class="icon-remove" onclick="trashClicked(' + index + ')" style="float:right;"></i>';
				var itemDisplay = label + img;
				return itemDisplay;
			}
		});
		$("#listBoxB").on("dragEnd change bindingComplete unselect select focus blur", function(event){
			console.log(event);
			getPreview();
		});

Also when one select an item in the list it triggers the change event even though it has not changed!

[Peter StoevKeymaster]

Hi reblutus,

The “change” event occurs when the selection is changed. In general, the “renderer” callback should be used for adding Static HTML Content for the items – styled Text, Images, Icons, not Dynamic Content like clickable close buttons. Such content may prevent the default event handling of the widget. In addition, you can start dragging only already selected item, because when you begin a drag operation, the dragged item is being selected and when you drop it, it is still selected. “focus” and “blur” are not part of the ListBox’s API.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[reblutusBlocked]

TMHO

1 – The change event SHOULD NOT be trigger when an item of the list box is selected: There has been no change in the number of items AND the items positions were not changed. No reason here to trigger a change event.

2- The change event SHOULD BE triggered when an item is remove through the method removeAt: There has been a change in the number of items in the list.

I can live with number 1 but for number 2 it is critical that you implement that!

As a work around each time I call the removeAt method I have to trigger a change manually:

$("#listBoxB").jqxListBox('removeAt', index );
$("#listBoxB").trigger('change');

[Peter StoevKeymaster]

Hi,

“change” event is triggered when selection is changed, not any other action.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[reblutusBlocked]

Maybe a “focus” event on the item selected would be much more appropriate than a “change” event on the listBox level. The list box itself did not change.

[Peter StoevKeymaster]

Hi reblutus,

From the documentation: “This event is triggered when the user selects an item.”

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts