Load on Demand in Telerik Rad Combo Box

Note: This is for web developers who are using their Telerik.

Introduction

When we create any application, generally we have few dropdown boxes that are common in the entire application like country, state, etc. Now in this tip, my focus is to use some tricks in Rad combo box to minimize the database hits.

But the question is, what is the use? The answer is simple...

• Code reusability
• Decrease database hits
• Uniformity of dropdown behavior in entire application
• It can be used for large list in rad combobox list as it will have the feature of load on demand

I have created a new DropDownDemo.aspx page add a Telerik Rad Combo Box.

<telerik:RadComboBox ID="rcbDemo" Width="80px" 
Height="200px" DropDownWidth="240" 
runat="server"EnableLoadOnDemand="true" 
ShowMoreResultsBox="true" EmptyMessage="All" 
EnableVirtualScrolling="true"OnClientDropDownOpening="OnClientDropDownOpening" 
OnClientItemsRequesting="OnClientItemsRequesting">

<WebServiceSettings Method="GetDemoData" Path="WebServicePath.aspx" />

</telerik:RadComboBox>

I am giving it the name “rcbDemo”,

Now I create a WebMethod “GetDemoData” in another Page “WebServicepath.aspx” in this page my code is like in file “WebServicepath.aspx.cs”.

using System;
using System.Collections.Generic;
using System.Data;
using System.Web;
using System.Web.Services;
using Telerik.Web.UI;
using System.Configuration;

namespace Demo
{
    public partial class WebServicePath : System.Web.UI.Page
    {
        private const int ITEMS_PER_REQUEST = 10;
      
        protected void Page_Load(object sender, EventArgs e)
        {

        }

  private static RadComboBoxData SetReturnValue(RadComboBoxData comboData)
        {
            comboData.Message = string.Empty;

            comboData.Items = new RadComboBoxItemData[]
            {
            };

            return comboData;
        }

        [WebMethod]
        public static RadComboBoxData GetDemoData(RadComboBoxContext context)
        {
            var comboData = new RadComboBoxData();

            if (HttpContext.Current.Session["DemoData"] == null)
            {
                return SetReturnValue(comboData);
            }
            using (var dtDemoData = ((DataTable)HttpContext.Current.Session["DemoData"]))
            {
                if (dtDemoData.Rows.Count < 0)
                {
                    return null;
                }
                var data = string.IsNullOrWhiteSpace(context.Text)
                    ? dtDemoData.Select()
                    : dtDemoData.Select("DemoText like'%" + context.Text + "%'");

                var itemOffset = context.NumberOfItems;
                var endOffset = Math.Min(itemOffset + ITEMS_PER_REQUEST, data.Length);
                comboData.EndOfItems = endOffset == data.Length;

                var result =
                    new List<RadComboBoxItemData>(endOffset - itemOffset);

                for (var itemIndex = itemOffset; itemIndex < endOffset; itemIndex++)
                {
                    var itemData = new RadComboBoxItemData
                    {
                        Text = data[itemIndex]["DemoText"].ToString(),
                        Value = data[itemIndex]["DemoValue"].ToString()
                    };

                    result.Add(itemData);
                }

                comboData.Message = GetStatusMessage(endOffset, data.Length);

                comboData.Items = result.ToArray();

                return comboData;
            }
        }

        public static string GetStatusMessage(int offSet, int totalRecords)
        {
            if (totalRecords <= 0)
            {
                return "No Match";
            }

            return string.Format("Items <b>1</b>-<b>{0}</b> 
            out of <b>{1}</b>", offSet, totalRecords);
        }
    }
}

In DropDownDemo.aspx, I already have the dropdown, now I need to bind that drop down and store the data in a Session[“DemoData”] so that I have the data till the session not expire .

In Page_Load

       protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                BindDemoDropDown();
            }
        }

      public void BindDemoDropDown()
        {
            if (Session["DemoData"] != null)
            {
                return;
            }
            //call the database to get the record
            using (var dtDemoData = YourFunctionThatBringtheList())
            {
                if (dtDemoData.Rows.Count <= 0)
                {
                    return;
                }
                var firstRow = dtDemoData.NewRow();
                firstRow["DemoText"] = "-Select-";
                firstRow["DemoValue"] = "-1";
                dtDemoData.Rows.InsertAt(firstRow, 0);
                Session["DemoData"] = dtDemoData;//this session will be used in WebServicePath
            }
        }

Hope this tip would help you in the development of applications.

Happy coding!

To know about Telerik controls, you can visit the following link:

• http://demos.telerik.com/aspnet-ajax/