Load on demand using ajax combo

2 posts, 0 answers
  1. Rachana
    Rachana avatar
    18 posts
    Member since:
    Jul 2011

    Posted 12 Jul 2012 Link to this post

    I need to use Cascading combo boxes for that to avoid post backs i selected Load on demand Ajax Combo....
    for first time selected values its working fine..when i will change item in the first combo-box the second combo box items are not get updated.my code is below

    <telerik:RadComboBox ID="RadComboState" runat="server" Width="250px" Height="150px"
                                                    EmptyMessage="Select a state" EnableLoadOnDemand="True" ShowMoreResultsBox="true"
                                                    EnableVirtualScrolling="true" OnItemsRequested="RadComboState_ItemsRequested">
                                                </telerik:RadComboBox>
      <telerik:RadComboBox ID="RadComboInstitution" runat="server" Width="250px" Height="150px"
                                                    EmptyMessage="Select an institution" EnableLoadOnDemand="True" ShowMoreResultsBox="true"
                                                    EnableVirtualScrolling="true" OnItemsRequested="RadComboInstitution_ItemsRequested"
                                                    OnClientItemsRequesting="GetSelectedState">
                                                </telerik:RadComboBox>
    function GetSelectedState(sender, eventArgs) {
                var SelectedState;
                var combo = Telerik.Web.UI.RadComboBox.ComboBoxes[0];
                SelectedState = combo.get_value();
                var context = eventArgs.get_context();
                context["StateId"] = SelectedState;
                 
            }      

    protected void RadComboState_ItemsRequested(object o, RadComboBoxItemsRequestedEventArgs e)
        {
            RadComboState.Items.Clear();
            DataSet data = PoulateStates();
            if (data.Tables.Count > 0 && data.Tables[0].Rows[0][0].ToString() == "0")
            {
                int itemOffset = e.NumberOfItems;
                int endOffset = Math.Min(itemOffset + ItemsPerRequest, data.Tables[0].Rows.Count);
                e.EndOfItems = endOffset == data.Tables[0].Rows.Count;
                for (int i = itemOffset; i < endOffset; i++)
                {
                    RadComboState.Items.Add(new RadComboBoxItem(data.Tables[0].Rows[i]["State_Name"].ToString(),
                                                                data.Tables[0].Rows[i]["intPkVal"].ToString()));
                }
                e.Message = GetStatusMessage(endOffset, data.Tables[0].Rows.Count);
            }
            else
            {
                RadComboBoxItem item = new RadComboBoxItem();
                item.Value = "-1";
                if (Session["COUNTRY"] != null && Session["COUNTRY"].ToString().ToUpper() == "MARSHALL ISLANDS")
                    item.Text = "No Island Exists";
                else
                    item.Text = "No State Exists";
                RadComboState.Items.Add(item);
            }
        }
         
        protected void RadComboInstitution_ItemsRequested(object o, RadComboBoxItemsRequestedEventArgs e)
        {
            RadComboInstitution.Items.Clear();
            DataSet Institution = new DataSet();
            
            try
            {
                string StateId = e.Context["StateId"].ToString();
                Institution = populateInstitution(StateId);
     
                if (Institution.Tables[0].Rows[0][0].ToString() == "0")
                {
                    int itemOffset = e.NumberOfItems;
                    int endOffset = Math.Min(itemOffset + ItemsPerRequest, Institution.Tables[0].Rows.Count);
                    e.EndOfItems = endOffset == Institution.Tables[0].Rows.Count;
     
                    for (int i = itemOffset; i < endOffset; i++)
                    {
                        RadComboInstitution.Items.Add(
                            new RadComboBoxItem(Institution.Tables[0].Rows[i]["Institution_Name"].ToString(),
                                                Institution.Tables[0].Rows[i]["InstitutionId"].ToString()));
                    }
     
                    e.Message = GetStatusMessage(endOffset, Institution.Tables[0].Rows.Count);             
                }
                else
                {
                    RadComboBoxItem item = new RadComboBoxItem();
                    item.Value = "-1";
                    item.Text = "No Institution Exists";
                    RadComboInstitution.Items.Add(item);
                }
     
            }
            catch (Exception ex)
            {
            }
        }

  2. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 12 Jul 2012 Link to this post

    Hi Rachana,

    Here is the code that I tried based on your scenario which works as expected. Refer  this demo for more.

    ASPX:
    <telerik:RadComboBox ID="RadComboBox1" runat="server" OnItemsRequested="RadComboBox1_ItemsRequested" OnClientSelectedIndexChanging="loadProducts">
    </telerik:RadComboBox>
    <telerik:RadComboBox ID="RadComboBox2" runat="server" OnItemsRequested="RadComboBox2_ItemsRequested" OnClientItemsRequested="ItemsLoaded">
    </telerik:RadComboBox>

    JS:
    <script type="text/javascript">
     var productCombo;
     function pageLoad()
     {
      productCombo = $find("<%= RadComboBox2.ClientID %>");
     }
     function loadProducts(sender, eventArgs)
     {
      var item = eventArgs.get_item();
      productCombo.set_text("Loading...");
      if (item.get_index() > 0)
      {
       productCombo.requestItems(item.get_value(), false);
      }
      else
      {
       productCombo.set_text("");
       productCombo.clearItems();
      }
     }
     function ItemsLoaded(sender, eventArgs)
     {
       if (sender.get_items().get_count() > 0)
       {
        sender.set_text(sender.get_items().getItem(0).get_text());
        sender.get_items().getItem(0).highlight();
       }
       sender.showDropDown();
     }
    </script>

    C#:
    protected void Page_Load(object sender, EventArgs e)
    {
     if (!Page.IsPostBack)
     {
      loadCategories();
     }
     else if (!Page.IsCallback)
     {
      loadProducts(RadComboBox1.SelectedValue);
     }
    }
     
    protected void loadCategories()
     {
      SqlDataAdapter adapter = new SqlDataAdapter();
      adapter.SelectCommand = new SqlCommand("SELECT * FROM Customers ORDER By CompanyName", conn);
      DataTable dt = new DataTable();
      adapter.Fill(dt);
      RadComboBox1.DataTextField = "CustomerID";
      RadComboBox1.DataValueField = "CustomerID";
      RadComboBox1.DataSource = dt;
      RadComboBox1.DataBind();
      RadComboBox1.Items.Insert(0, new RadComboBoxItem("- Select.... -"));     
    }
     
    protected void loadProducts(string CategoryID)
     {
      SqlDataAdapter adapter = new SqlDataAdapter();
     adapter.SelectCommand = new SqlCommand("SELECT * FROM Orders WHERE CustomerID=@CustomerID ORDER By CustomerID", conn);
     adapter.SelectCommand.Parameters.AddWithValue("@CustomerID", CategoryID);
     DataTable dt = new DataTable();
     adapter.Fill(dt);
     RadComboBox2.DataTextField = "OrderID";
     RadComboBox2.DataValueField = "OrderID";
     RadComboBox2.DataSource = dt;
     RadComboBox2.DataBind();
    }
     
    protected void RadComboBox1_ItemsRequested(object sender, Telerik.Web.UI.RadComboBoxItemsRequestedEventArgs e)
     {
      loadCategories();
     }
    protected void RadComboBox2_ItemsRequested(object sender, Telerik.Web.UI.RadComboBoxItemsRequestedEventArgs e)
     {
      loadProducts(e.Text);
     }

    Thanks,
    Princy.
Back to Top