Multiple ComboBox

5 posts, 0 answers
  1. Lawrence
    Lawrence avatar
    11 posts
    Member since:
    Jun 2015

    Posted 14 May 2017 Link to this post

    Hi,

    I am creating a multiple ComboBox. RadComboBox1 for region and the other RadComboBox2 for product. Both controllers have a checkbox option. Sample data as per below;

    RadComboBox1;
    A
    B
    C

    RadComboBox2;
    1
    2
    3

    What do I need are, when user choose Region [A,C] and product [1,2,3], the result would be [A1,A2,A3,C1,C2,C3]. Please help.

     

    Thanks.

     

     

     

  2.
  3. Vessy
    Admin
    Vessy avatar
    2342 posts

    Posted 15 May 2017 Link to this post

    Hi Lawrence,

    If I understand the scenario properly you want to bind the second ComboBox depending on the value selected in the first one. If so, you can see how to implement this in the followind live demo:
    http://demos.telerik.com/aspnet-ajax/combobox/examples/functionality/multiplecomboboxes/defaultcs.aspx

    If this is not the case, please, elaborate a bit on the exact scenario you want to achieve so we can advice you further.

    Regards,
    Vessy
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Lawrence
    Lawrence avatar
    11 posts
    Member since:
    Jun 2015

    Posted 15 May 2017 in reply to Vessy Link to this post

    Hi Vessy,

    Referring to live demo given, the combo box is a single option. My case has a checkbox within the both controllers for multichoice.

    ASPX Code:

    <telerik:RadComboBox ID="rcbRegion" runat="server" CheckBoxes="True" EnableCheckAllItemsCheckBox="true"
                            DataSourceID="sds_getRegion" DataTextField="_REGION" DataValueField="_REGION">
                        </telerik:RadComboBox>
                        <telerik:RadComboBox ID="rcbProduct" runat="server" CheckBoxes="True" EnableCheckAllItemsCheckBox="true"
                            DataSourceID="sds_getProduct" DataTextField="_PRODUCT" DataValueField="_PRODUCT">
                        </telerik:RadComboBox>

     

    May refer attached picture for UI view.

    Thanks.

     

  7. Lawrence
    Lawrence avatar
    11 posts
    Member since:
    Jun 2015

    Posted 16 May 2017 in reply to Lawrence Link to this post

    Hi Vessy,

    Finally, I am able to manage the code and get the result as what I need.

    Aspx :

    <div class="form-group">
        <label>Region : </label>
        <telerik:RadComboBox ID="rcbRegion" runat="server" CheckBoxes="True" EnableCheckAllItemsCheckBox="true"
            DataSourceID="sds_getRegion" DataTextField="_REGION" DataValueField="_REGION">
        </telerik:RadComboBox>
    </div>
    <div class="form-group">
        <label>Product : </label>
        <telerik:RadComboBox ID="rcbProduct" runat="server" CheckBoxes="True" EnableCheckAllItemsCheckBox="true"
            DataSourceID="sds_getProduct" DataTextField="_PRODUCT" DataValueField="_PRODUCT" DropDownWidth="300px">
        </telerik:RadComboBox>
    </div>

    C#

    protected void btnSubmit_Click(object sender, EventArgs e)
            {
                string checkedRegion = string.Empty;
                string checkedProduct = string.Empty;
                string checkedText = string.Empty;
                foreach (RadComboBoxItem reg in rcbRegion.Items)
                {
                    if (reg.Checked)
                    {
                        checkedRegion = reg.Text;
                        foreach (RadComboBoxItem pro in rcbProduct.Items)
                        {
                            if (pro.Checked)
                            {
                                checkedProduct = pro.Text;
                                checkedText += checkedRegion + "-" + checkedProduct + ", ";
                            }
                        }
                    }
                    else { checkedRegion = "0"; }
                }
                lblGroupString.Text = checkedText.Trim().TrimEnd(',');
            }

     

    Appreciate your response.

    Thanks.
  8.
  9. Vessy
    Admin
    Vessy avatar
    2342 posts

    Posted 18 May 2017 Link to this post

    Hi,

    Thank you for the update, Lawrence as well as for sharing your solution with our community. I am glad you manged to implement the target scenario.

    Regards,
    Vessy
    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top