Keep state of items when ListBox scrolls?

[NicolasParticipant]

Hi,
I have a listbox with a custom renderer. In my renderer, I create a item with a custom checkbox for each item. I know the ListBox can generate automatically checkboxes, but this feature was too limited for me, so I needed to create my own checkboxes.

But here is my problem : if I uncheck a checkbox, and I scroll the ListBox, the checkbox is rechecked automatically. I first thought that I needed to handle that in the renderer, but it seems the renderer isn’t call back when the user scroll.

Is there a way to solve this?

[DimitarParticipant]

Hello Nicolas,

The renderer callback function is called when a listbox item becomes visible for the first time. Please provide us with a complete example, which we may test locally to determine the source of the issue.

Best Regards,
Dimitar

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

[DimitarParticipant]

UPDATE: Unfortunately, dynamic HTML cannot be loaded in listbox items.

Best Regards,
Dimitar

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

[NicolasParticipant]

Ok, I couldn’t reproduce exactly my case, but I think this jsFiddle is still fine to show the problem :
http://jsfiddle.net/7L2vH/

First, you need to click on one or more radios. Then, scroll the listbox. In my jsFiddle, you will see that the next line takes the value of it predecessor. In my app, they just always become uncheck each time the user scroll.

Regards

[Peter StoevKeymaster]

Hi Nicolas,

As, Dimitar wrote in the previous post of this topic, dynamic content in List Items is not supported. The custom renderer function allows you to display static content such as text, images or HTML which does not include user interaction. There’s no workaround available for your scenario due to the reason that this is the behavior by design i.e jqxListBox is not a container of widgets/plugins.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[NicolasParticipant]

Ok thanks!

In that case, may be I can use the checkbox property. Here’s what I need to do : when the user check/uncheck a checkbox, I need to trigger functionA. But if he clicks on the label of a checkbox, instead of triggering functionA, I need to trigger functionB only.

Do you see a way to do this? I tried adding a click event, but it was triggering functions A & B at the same time.

I’m pretty desperate, because I built my entire solution with jqListBox, and didn’t notice that problem. If I can find another workaround, I’ll have switch the entire list plugin.

Regards

[Peter StoevKeymaster]

Hi Nicolas,

You may use the “checkChange” event. It provides information about the checked/unchecked item, too.

$("#jqxListBox").on('checkChange', function (event) {
    var args = event.args;
    // get new check state.
    var checked = args.checked;
    // get the item and it's label and value fields.
    var item = args.item;
    var itemLabel = item.label;
    var itemValue = item.value;
    // get all checked items.
    var checkedItems = $("#jqxListBox").jqxListBox('getCheckedItems');
});

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com

[Author]

Posts