Getting ListBox Item Sequence

2 posts, 1 answers
  1. Ian
    Ian avatar
    10 posts
    Member since:
    Feb 2012

    Posted 18 Apr Link to this post

    I have a listBox that I can manually sort using the toolbar buttons. The ListBox is in a form, so when I submit a form, the items in that list box get submitted as an int array. However, regardless of how I sort the ListBox, the array of items is always in the same order. I assume that, as there is functionality to interactively sort a list box, there is a method to get that sequence out. I can't find an example of how this might be achieved in the context of a listbox in a form. Could you provide some pointers? Thanks.

    Ian Parsons.

  2. Answer
    Alex Hajigeorgieva
    Admin
    Alex Hajigeorgieva avatar
    790 posts

    Posted 22 Apr Link to this post

    Hi, Ian,

    Currently the Kendo UI ListBox does not keep the order of its hidden select element and its options the same as the visible items. Since the form elements are posted in a form, we need to ensure the order matches. One way you can achieve that is by adding a Reorder() event handler function:

    https://docs.telerik.com/kendo-ui/api/javascript/ui/listbox/events/reorder

    .Events(e=>e.Reorder("onReorder"))
     
    <script>
        function onReorder(e) {
            e.preventDefault();
            var dataSource = e.sender.dataSource;
     
            var dataItem = e.dataItems[0]
            var index = dataSource.indexOf(dataItem) + e.offset;
            dataSource.remove(dataItem);
            dataSource.insert(index, dataItem);
            e.sender.wrapper.find("[data-uid='" + dataItem.uid + "']").addClass("k-state-selected");
        }
    </script>

    If you would like to see the Kendo UI ListBox keeping its items and its select options in sync, I can easily convert this forum thread to a feature request so people can upvote it. The more popular a feature gets, the sooner we start working on it.

    Let me know if you would like to do that.

    Kind Regards,
    Alex Hajigeorgieva
    Progress Telerik
    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top