Filter RadComboBox from another combobox

7 posts, 0 answers
  1. Valentino
    Valentino avatar
    5 posts
    Member since:
    Jul 2010

    Posted 23 Jul 2010 Link to this post

    Hi guys,
    it is possible to filter a RadComboBox based on another RadComboBox?

    Actually this is the situation:

    I have two RadComboBox
    Progetto: <telerik:RadComboBox runat="server" Width="300px" ID="comboProgetto">               
                </telerik:RadComboBox>
    <br />
    E' sottoargomento di: <telerik:RadComboBox runat="server" Width="300px" ID="comboSottoArgomento">               
                </telerik:RadComboBox>

    I want that the values in "comboSottoArgomento" is filter, based on the value selected in comboProgetto.
    Is this possible?
    Actually both RadComboBoxes are filled from a mysql database and there is a foreign key that bound the fields.


    Sorry for my english
  2. Kalina
    Admin
    Kalina avatar
    918 posts

    Posted 23 Jul 2010 Link to this post

    Hi Valentino,

    As I understand you want to create a relation between two RadComboBox controls - to populate second control with data according the selected value at the first control.
    Please take a look at our “Related ComboBoxes” online demo.

    Greetings,
    Kalina
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. Ciupaz
    Ciupaz avatar
    47 posts
    Member since:
    Jun 2020

    Posted 12 Jul in reply to Kalina Link to this post

    I've tried in this way Kalina, but it's very slow (spinning wheel stays on screen a lot).

    Do you have idea why?

    Luis

  4. Ciupaz
    Ciupaz avatar
    47 posts
    Member since:
    Jun 2020

    Posted 12 Jul in reply to Ciupaz Link to this post

    Also, the 3rd combo does not have the spinning wheel, and I don't know why. 

    L

  5. Attila Antal
    Admin
    Attila Antal avatar
    573 posts

    Posted 13 Jul Link to this post

    Hi Ciupaz,

    Here is an example for creating Cascading ComboBoxes using CheckBoxes:

    Markup - ComboBoxes

    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    </telerik:RadAjaxManager>
    <telerik:RadComboBox ID="RadComboBox1" runat="server" AutoPostBack="true" OnLoad="RadComboBox1_Load" OnSelectedIndexChanged="RadComboBox1_SelectedIndexChanged" EmptyMessage="Select a Continent">
    </telerik:RadComboBox>
    <telerik:RadComboBox ID="RadComboBox2" runat="server" AutoPostBack="true" EmptyMessage="Select a Country" CheckBoxes="true" OnItemChecked="RadComboBox2_ItemChecked">
    </telerik:RadComboBox>
    <telerik:RadComboBox ID="RadComboBox3" runat="server" AutoPostBack="true" EmptyMessage="Select a City">
    </telerik:RadComboBox>

     

    C# -  code behind

    protected void RadComboBox1_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            var combo = (sender as RadComboBox);
            combo.DataSource = Enumerable.Range(1, 3).Select(x => new { value = x, text = "Continent " + x });
            combo.DataTextField = "text";
            combo.DataValueField = "value";
            combo.DataBind();
        }
    }
    
    protected void RadComboBox1_SelectedIndexChanged(object sender, RadComboBoxSelectedIndexChangedEventArgs e)
    {
        RadComboBox2.ClearSelection();
        RadComboBox3.Items.Clear();
        RadComboBox3.ClearSelection();
        RadComboBox2.DataSource = Enumerable.Range(1, 3).Select(x => new { value = x, text = "Continent " + e.Value.ToString() + " Country " + x }); ;
        RadComboBox2.DataTextField = "text";
        RadComboBox2.DataValueField = "value";
        RadComboBox2.DataBind();
    }
    
    private List<dynamic> Cities()
    {
        var cities = new List<dynamic>();
    
        cities.Add(new { value = 1, countrtyId = 1, text = "Country 1, City 1" });
        cities.Add(new { value = 2, countrtyId = 1, text = "Country 1, City 2" });
        cities.Add(new { value = 3, countrtyId = 1, text = "Country 1, City 3" });
        cities.Add(new { value = 4, countrtyId = 2, text = "Country 2, City 1" });
        cities.Add(new { value = 5, countrtyId = 2, text = "Country 2, City 2" });
        cities.Add(new { value = 6, countrtyId = 2, text = "Country 2, City 3" });
        cities.Add(new { value = 7, countrtyId = 3, text = "Country 3, City 1" });
        cities.Add(new { value = 8, countrtyId = 3, text = "Country 3, City 2" });
        cities.Add(new { value = 9, countrtyId = 3, text = "Country 3, City 3" });
    
        return cities;
    }
    
    protected void RadComboBox2_ItemChecked(object sender, RadComboBoxItemEventArgs e)
    {
        var combo = (sender as RadComboBox);
    
        List<string> selectedCountries = new List<string>();
    
        foreach (var checkedItem in combo.CheckedItems)
        {
            selectedCountries.Add(checkedItem.Value.ToString());
        }
    
        RadComboBox3.DataSource = Cities().Where(x => selectedCountries.Contains(Convert.ToString(x.countrtyId)));
        RadComboBox3.DataTextField = "text";
        RadComboBox3.DataValueField = "value";
        RadComboBox3.DataBind();
    }

     

    Documentation for the APIs used in this scenario can be found below:

     

    Kind regards,
    Attila Antal
    Progress Telerik

  6. Ciupaz
    Ciupaz avatar
    47 posts
    Member since:
    Jun 2020

    Posted 13 Jul in reply to Attila Antal Link to this post

    A little adding Attila.
    How can I add a spinning wheel - or something similar - in the meantime that one combo gets data from DB?

    In my case, after selected one value from one combo, the following take several seconds to show results.

    Luis

  7. Attila Antal
    Admin
    Attila Antal avatar
    573 posts

    Posted 16 Jul Link to this post

    Hi Luigi,

    I have already shared my answer in your support ticket and I am sharing it again here. To enable loading indicators for the Controls while they do actions on the server, you can enable AJAX, see RadAjaxManager - Telerik ASP.NET AjaxManager

    You can then set up a Loading panel that will be engaged during an AJAX request. This Loading panel can be customized to display any losing animation of your choice, by using Templates, see AjaxLoadingPanel - Templates and Transparency

    Kind regards,
    Attila Antal
    Progress Telerik

Back to Top