fill combobox with values of 2 other comboboxes

6 posts, 0 answers
  1. Mart
    Mart avatar
    8 posts
    Member since:
    Aug 2006

    Posted 28 Mar 2012 Link to this post

    Hello,

    I Have 3 comboboxes.
    when selecting a value in combobox 1 it fills the values of combobox 2

    now i want to fill the values of combobox 3 based on the selected values of combobox1 and combobox 2

    How can I achieve this on clientside
  2. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 28 Mar 2012 Link to this post

    Hi Mart,

    Try the following code to fill value in the RadComboBox.

    ASPX:
    <telerik:RadComboBox ID="RadComboBox1" runat="server" OnClientSelectedIndexChanging="LoadCustomerID"  EnableCheckAllItemsCheckBox="true" OnItemsRequested="RadComboBox_ItemsRequested">
    </telerik:RadComboBox>
    <telerik:RadComboBox ID="RadComboBox2" runat="server" OnClientItemsRequested="ItemsLoaded" OnClientSelectedIndexChanging="LoadOrderID"  EnableCheckAllItemsCheckBox="true" OnItemsRequested="RadComboBox2_ItemsRequested">
    </telerik:RadComboBox>
    <telerik:RadComboBox ID="RadComboBox3" runat="server" OnClientItemsRequested="ItemsLoaded"  EnableCheckAllItemsCheckBox="true" OnItemsRequested="RadComboBox3_ItemsRequested">
    </telerik:RadComboBox>

    C#:
    protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
                LoadCustomerID();
            else if (!Page.IsCallback)
            {
                LoadOrderID(RadComboBox1.SelectedValue);
                LoadProductID(RadComboBox2.SelectedValue);
            }
        }
        protected void RadComboBox_ItemsRequested(object sender, Telerik.Web.UI.RadComboBoxItemsRequestedEventArgs e)
        {
            LoadCustomerID();
        }
        protected void LoadCustomerID()
        {
            String ConnString = ConfigurationManager.ConnectionStrings["NorthwindConnectionString"].ConnectionString;
            SqlConnection conn = new SqlConnection(ConnString);
            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 RadComboBox2_ItemsRequested(object sender, RadComboBoxItemsRequestedEventArgs e)
        {
            LoadOrderID(e.Text);
        }
        protected void LoadOrderID(string continentID)
        {
            String ConnString = ConfigurationManager.ConnectionStrings["NorthwindConnectionString"].ConnectionString;
            SqlConnection conn = new SqlConnection(ConnString);
            SqlDataAdapter adapter = new SqlDataAdapter();
            adapter.SelectCommand = new SqlCommand("SELECT * FROM Orders WHERE CustomerID=@CustomerID ORDER By CustomerID", conn);
            adapter.SelectCommand.Parameters.AddWithValue("@CustomerID", continentID);
            DataTable dt = new DataTable();
            adapter.Fill(dt);
            RadComboBox2.DataTextField = "OrderID";
            RadComboBox2.DataValueField = "OrderID";
            RadComboBox2.DataSource = dt;
            RadComboBox2.DataBind();
        }
        protected void RadComboBox3_ItemsRequested(object sender, RadComboBoxItemsRequestedEventArgs e)
        {
            LoadProductID(e.Text);
        }
        protected void LoadProductID(string countryID)
        {
            String ConnString = ConfigurationManager.ConnectionStrings["NorthwindConnectionString"].ConnectionString;
            SqlConnection conn = new SqlConnection(ConnString);
            SqlDataAdapter adapter = new SqlDataAdapter();
            adapter.SelectCommand = new SqlCommand("SELECT * FROM [Order Details] WHERE OrderID =@OrderID ORDER By ProductID", conn);
            adapter.SelectCommand.Parameters.AddWithValue("@OrderID", countryID);
     
            DataTable dt = new DataTable();
            adapter.Fill(dt);
     
            RadComboBox3.DataTextField = "ProductID";
            RadComboBox3.DataValueField = "ProductID";
            RadComboBox3.DataSource = dt;
            RadComboBox3.DataBind();
        }

    JS:
    <script type="text/javascript">
        var countriesCombo;
        var citiesCombo;
        function pageLoad() {
                    countriesCombo = $find("<%= RadComboBox2.ClientID %>");
                    citiesCombo = $find("<%= RadComboBox3.ClientID %>");
        }
        function LoadCustomerID(sender, eventArgs) {
            var item = eventArgs.get_item();
            countriesCombo.set_text("Loading...");
            citiesCombo.clearSelection();
            if (item.get_index() > 0) {
                countriesCombo.requestItems(item.get_value(), false);
            }
            else {
                countriesCombo.set_text(" ");
                countriesCombo.clearItems();
                citiesCombo.set_text(" ");
                citiesCombo.clearItems();
            }
        }
        function LoadOrderID(sender, eventArgs) {
            var item = eventArgs.get_item();
            citiesCombo.set_text("Loading...");
            citiesCombo.requestItems(item.get_value(), false);
        }
        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>

    I tried this by referring into the following demo.
    ComboBox / Related ComboBoxes

    Thanks,
    -Shinu.
  3. Mart
    Mart avatar
    8 posts
    Member since:
    Aug 2006

    Posted 28 Mar 2012 Link to this post

    Hello,
     
    This uses only input from combobox2 in query for combobox3
    I need to get 2 parameters in query for combobox3

    so in this case

    SELECT * FROM [Order Details] WHERE OrderID =@OrderID AND CustomerID=@CustomerID ORDER By ProductID"

    @OrderID is combobox2.selectedvalue and
    @customerID is combobox1.selectedvalue

    Hope you can help

    Mart
  4. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 28 Mar 2012 Link to this post

    Hi Mart,

    Try the following code snippet.

    C#:
    protected void RadComboBox3_ItemsRequested(object sender, RadComboBoxItemsRequestedEventArgs e)
       {
     
           LoadProductID(RadComboBox2.SelectedValue, RadComboBox1.SelectedValue);
       }
       protected void LoadProductID(string countryID, string ProductID)
       {
           ................
           adapter.SelectCommand = new SqlCommand("SELECT * FROM [Order Details] WHERE OrderID =@OrderID AND CustomerID=@CustomerID ORDER By ProductID", conn);
           adapter.SelectCommand.Parameters.AddWithValue("@OrderID", countryID);
           adapter.SelectCommand.Parameters.AddWithValue("@CustomerID", CustomerID);
           ................
       }

    Thanks,
    -Shinu.
  5. Mart
    Mart avatar
    8 posts
    Member since:
    Aug 2006

    Posted 28 Mar 2012 Link to this post

    Hello,

    First thank yoy for your help.
    This is not working because there is no postback to the server.
    I need to get radcombo1.valueselected from client within javascript

    Mart

  6. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 29 Mar 2012 Link to this post

    Hi Mart,

    Since we have to bind RadComboBox to a DataSource we need a server postback. So please make sure that you set AutoPostBack to true.

    Thanks,
    -Shinu.
Back to Top