ASP.NET MVC ListBox - Load Items on Demand with Paging

    Displaying items 0-0 out of 0.


    The items of the ListBox can be loaded on-demand (via AJAX requests). The advantage of using this approach
    is that the items are loaded asynchronously. Thus, the page will load very fast because no item is loaded on page load.

    In order to enable the on demand loading feature, set the EnableLoadOnDemand property to true.
    You also need to specify an action method that will be used to load the items on demand, using the OnLoadingItems property.

    To improve the performance even further, you can use the "paging" approach for the load on demand feature.
    Using this approach will force the ListBox to load only a limited number at a time, instead of retrieving all the matches at once.
    So for example, if there are 10,000 items in the database, you can configure the ListBox to load 100 items at a time, to make the on demand loading functionality run smoother.

    To load the next set of items, the end user simply needs to click on the footer text from the bottom of the list with items.
    View - Aspx 
     
    <% Html.Obout(new ListBox("ListBox1") 
    {                
        EnableLoadOnDemand = true,
        OnLoadingItems = "ListBox/LoadingItemsWithPaging"
    }); %>
    View - Razor 
     
    @Html.Obout(new ListBox("ListBox1") 
    {                
        EnableLoadOnDemand = true,
        OnLoadingItems = "ListBox/LoadingItemsWithPaging"
    })
    Controller 
       
    public JsonResult LoadingItemsWithPaging(ListBoxLoadingItemsEventArgs args)
    {
        ListBoxItemList items = GetFilteredCustomers(args.Text, args.ItemsOffset);
        int itemsCount = GetFilteredCustomersCount(args.Text);
        int itemsLoadedCount = args.ItemsOffset + items.Count();

        JsonResult result = new JsonResult
        {
            Data = new
            {
                Items = items,
                ItemsCount = itemsCount,
                ItemsLoadedCount = itemsLoadedCount
            },
            JsonRequestBehavior = JsonRequestBehavior.AllowGet
        };

        return result;
    }

    "We have purchased the obout suite of controls and have used it in our web apps. It has worked great in many apps giving them a great look and feel and extremely versatile."

    Kaydee Dwarak
    Grocers Supply

    Random testimonial   All testimonials

    Products Downloads