Home / Community & Support / Code Library / ASP.NET and ASP.NET AJAX > Grid > Using cascading RadComboBoxes into the RadGrid Insert/Edit form

• Answer Telerik Admin Master

  Posted on Oct 29, 2010 (permalink)

  Requirements
  RadControls for ASP .NET AJAX version	Q2 2010 and later
  .NET version	3.5 and late
  Visual Studio version	2008 and later
  Programming language	C#, VB
  Browser support	all browsers supported by RadControls for ASP .NET AJAX

  
  PROJECT DESCRIPTION
  The attached sample project demonstrates how to use the cascading RadComboBoxes into the RadGrid's edit item. When the RadGrid's item is in Edit mode three RadComboBoxes are rendered and the list in the next combo is populated after selecting a value in the previous:
  Step 1: Select Continent
  
  
  Step 2: Select Country
  
  
  Step 3: Select City
  
  
  The cascading RadComboBoxes are added into the UserControl which is placed into the RadGrid.MasterTableView.FormTemplate:
  

  <EditFormSettings EditFormType="Template">

   <FormTemplate>

    <table>

      <tr>

        <td>

          ...

        </td>

        </tr>

      <tr>

        <td>

         <user:MyUserControl runat="server" ID="UserControl1" />

        </td>

      </tr>

        <tr>

           <td align="right" colspan="2">

               ...

           </td>

        </tr>

     </table>

   </FormTemplate>

  </EditFormSettings>

  
  ASCX:
  

  <asp:Label ID="Label1" runat="server" AssociatedControlID="RadComboBox1">Continent:</asp:Label>

   <telerik:RadComboBox ID="RadComboBox1" runat="server" Width="186px" CssClass="ComboBox_Continents" OnClientSelectedIndexChanging="LoadCountries" OnItemsRequested="RadComboBox1_ItemsRequested" />

   <asp:Label ID="Label2" runat="server" AssociatedControlID="RadComboBox2">Country:</asp:Label>

  <telerik:RadComboBox ID="RadComboBox2" runat="server" Width="186px" CssClass="ComboBox_Countries" OnClientSelectedIndexChanging="LoadCities" OnClientItemsRequested="ItemsLoaded" OnItemsRequested="RadComboBox2_ItemsRequested" />

  <asp:Label ID="Label3" runat="server" AssociatedControlID="RadComboBox3">City:</asp:Label>

   <telerik:RadComboBox ID="RadComboBox3" runat="server" Width="186px" CssClass="ComboBox_Cities" OnClientItemsRequested="ItemsLoaded" OnItemsRequested="RadComboBox3_ItemsRequested" />

  When the RadGrid's edit form is loaded the user RadComboBoxes are populated with data and the appropriate items are selected:
  

  protected void Page_Load(object sender, EventArgs e)

  {

       ...

       int cityId = Convert.ToInt32(((this.Parent.Parent.NamingContainer as GridEditFormItem).ParentItem.DataItem as DataRowView).Row["City"]);

       City city = GetCityById(cityId);

       Country country = GetCountryById(city.CounryID);

       Continent continent = GetContinentById(country.CountinentID);

       LoadContinents();

       RadComboBox1.SelectedValue = continent.ID.ToString();

       LoadCountries(continent.ID.ToString());

       RadComboBox2.SelectedValue = country.ID.ToString();

       LoadCities(country.ID.ToString());

       RadComboBox3.SelectedValue = city.ID.ToString();

      ...

  }

  
  On the Insert/Update command of the RadGrid you could get the city Id from the last RadCombobox by using the following code snippet:
  

  GridEditFormItem item = e.Item as GridEditFormItem;

  int cityId = Convert.ToInt32((item.FindControl("UserControl1").FindControl("radComboBox3") as RadComboBox).SelectedValue);

  Attached files

  • examplecs.rar
  • examplevb.rar

Back to Top

Home / Community & Support / Code Library / ASP.NET and ASP.NET AJAX > Grid > Using cascading RadComboBoxes into the RadGrid Insert/Edit form