Multiple Radcomboboxes

[Amirtha S]

Hi
I have a scenario where the selection made in combo1 must update the combo2 and combo3. The multiple combo example provided in this website was useful to some extent. But I am not able to come up with the Javascript part that takes care of updating the combo2 and combo3 when combo1 is selected.

I tried to make use of this piece of code from another thread but it is not helping me. This piece of code was used for dynamically created Radcomboboxes.

<script>
function goLoadCountries(combo, eventArqs)
{
    var item = eventArqs.get_item();
    var prompt;

    combo.tempVal = item.get_value();


    for (i = 0; i < Telerik.Web.UI.RadComboBox.ComboBoxes.length; i++) {
        prompt = Telerik.Web.UI.RadComboBox.ComboBoxes[i];

        if (prompt.get_attributes().getAttribute("parent") == combo.get_id()) {
            prompt.set_text("Loading...");
            prompt.requestItems(item.get_value(), false);

        }
    }
}


function ItemsLoaded(combo, eventArgs) {
    if (combo.get_items().get_count() > 0)
    {
        combo.get_inputDomElement().className = "rcbInput";
        var item = combo.get_items().getItem(0);
        item.select();
    }
}


function buildForm(sender, eventArgs){
    var context = eventArgs.get_context();
    for (i=0; i<Telerik.Web.UI.RadComboBox.ComboBoxes.length; i++){
        context[Telerik.Web.UI.RadComboBox.ComboBoxes[i].get_id()] = Telerik.Web.UI.RadComboBox.ComboBoxes[i].tempVal;
    }
}
        </script>

When I use the above code I am getting a Javascript error saying 'buildform' is undefined.

Here is the HtML part:

<td>Location:</td>
                     <td><telerik:RadComboBox ID="cbLocation" runat="server" Skin="Black" SelectedValue='<%# DataBinder.Eval( Container, "DataItem.locationName") %>'
                        EmptyMessage=" Select Location" HighlightTemplatedItems="True" DataTextField="name" EnableLoadOnDemand="true"
                        DataValueField="locationId" EnableTextSelection="False" DataSourceID="SqlDataSource_Loc"
                        AppendDataBoundItems="True" OnClientSelectedIndexChanging="loadCombos" OnClientItemsRequesting="buildForm"
                          >
                        <Items>
                            <telerik:RadComboBoxItem Text="" Value="" Selected="True" />
                        </Items>
                        </telerik:RadComboBox>

                        </td>
                </tr>
                <tr>
                    <td>Aircraft:</td>
                <td>
                        <telerik:RadComboBox ID="cbAircraft" runat="server" Skin="Black" SelectedValue='<%# DataBinder.Eval( Container, "DataItem.Aircraft") %>'
                        EmptyMessage=" Select Aircraft" HighlightTemplatedItems="True" OnClientItemsRequested="ItemsLoaded"
                        OnItemsRequested="radAircraft_ItemsRequested" OnClientItemsRequesting="buildForm" EnableLoadOnDemand="false"
                        AppendDataBoundItems="true">
                        <Items>
                            <telerik:RadComboBoxItem Text="" Value="" />
                        </Items>
                        </telerik:RadComboBox>

Pls help me to come up with the code.

Thanks

[Simon]

Hi Amirtha S,

I was unable to recreate the error with the code you provided. Please see the attached page. Am I missing something?

Regards,
Simon
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.

[Amirtha S]

Hi
I solve that part. Now onclick of the location radcombobox, the aircraft, pcname and piname boboxes are getting compopulated. I used the this code and it is working now.

function loadCombos(combo, eventarqs) {
        var prompt;
        var item = eventarqs.get_item();
        combo.tempVal = item.get_value();
        var aircraftCombo = $find("<%= cbAircraft.ClientID %>");
        var pcnameCombo = $find("<%= cbPCName.ClientID %>");
        var pinameCombo = $find("<%= cbPIName.ClientID %>");

        for (var i = 0; i < Telerik.Web.UI.RadComboBox.ComboBoxes.length; i++) {
            prompt = Telerik.Web.UI.RadComboBox.ComboBoxes[i];
            if (prompt.get_id() == aircraftCombo.get_id()) {
                prompt.set_text("Loading...");
                aircraftCombo.clearSelection();
                prompt.requestItems(item.get_value(), false);

            }
            else if (prompt.get_id() == pcnameCombo.get_id()) {
                prompt.set_text("Loading...");
                prompt.requestItems(item.get_value(), false);
            }
            else if (prompt.get_id() == pinameCombo.get_id()) {
                prompt.set_text("Loading...");
                prompt.requestItems(item.get_value(), false);
            }

        }
    }

    function ItemsLoaded(combo, eventarqs) {
        if (combo.get_items().get_count() > 0) {
            //            combo.set_text(combo.get_items().getItem(0).get_text());
            //            combo.get_items().getItem(0).highlight();
            combo.get_inputDomElement().className = "rcbInput";
            var item = combo.get_items().getItem(0);
            item.select();

        }
    }

I am facing a different ptoblem now. All these comboboxes reside inside the editform (usercontrol) of a radgrid. The values that I select for the pcname and piname comboboxes always result in null in the insercommand function of the radgrid. I am not sure of I am setting the selected value of these comboboxes correctly. Pls help me fix this.

Here is the aspx code

<telerik:RadComboBox ID="cbPCName" runat="server" Skin="Black" SelectedValue='<%# DataBinder.Eval( Container, "DataItem.pcPersonId") %>'
                            EmptyMessage=" Select PC" HighlightTemplatedItems="True" EnableLoadOnDemand="false"
                            OnClientItemsRequested="ItemsLoaded" OnItemsRequested="cbPCName_ItemsRequested"
                            AppendDataBoundItems="true" OnClientSelectedIndexChanged="displayName">
                            <ItemTemplate>
                                <ul>
                                    <li class="col1">
                                        <%# DataBinder.Eval(Container, "DataItem.pcLastName")%></li>
                                </ul>
                            </ItemTemplate>
                            <Items>
                                <telerik:RadComboBoxItem Text="" Value="" />
                            </Items>
                        </telerik:RadComboBox>
                    </td>
                </tr>
                <tr>
                    <td>
                        PI:
                    </td>
                    <td>
                        <telerik:RadComboBox ID="cbPIName" runat="server" Skin="Black" SelectedValue='<%# DataBinder.Eval( Container, "DataItem.piLastName") %>'
                            EmptyMessage=" Select PI" HighlightTemplatedItems="True" OnClientItemsRequested="ItemsLoaded" OnItemsRequested="cbPIName_ItemsRequested"
                            AppendDataBoundItems="true" >
                            <Items>
                                <telerik:RadComboBoxItem Text="" Value="" />
                            </Items>
                        </telerik:RadComboBox>

Codebehind:

protected void radAircraft_ItemsRequested(object o, RadComboBoxItemsRequestedEventArgs e)
        {
            loadAircrafts(e.Text);
        }

        protected void cbPCName_ItemsRequested(object o, Telerik.Web.UI.RadComboBoxItemsRequestedEventArgs e)
        {
            loadPCPINames("cbPCName", e.Text);
        }

        protected void cbPIName_ItemsRequested(object o, Telerik.Web.UI.RadComboBoxItemsRequestedEventArgs e)
        {
            loadPCPINames("cbPIName",e.Text);
        }

        protected void loadAircrafts(string locationID)
        {
            DataTable dt = new DataTable();
            SqlConnection cn = null;

            try
            {
                cn = new SqlConnection(connstr1);
                cn.Open();

                SqlDataAdapter sda1 = new SqlDataAdapter("SELECT AircraftModel.name, aircraftId, identification, aircraftAlias FROM AircraftModel INNER JOIN Aircraft ON AircraftAircraftModel.modelId = Aircraft.modelId INNER JOIN OfficeLocation ON Aircraft.officeLocationId = OfficeLocation.officeLocationId where  OfficeLocation.locationId = '" + locationID + "'", cn);
                sda1.Fill(dt);

                cbAircraft.DataTextField = "name";
                cbAircraft.DataValueField = "aircraftId" ;
                cbAircraft.DataSource = dt;
                cbAircraft.DataBind();

            }
            catch (SqlException ex) { Console.WriteLine(ex); }
            finally
            {
                if (cn != null)
                { cn.Close(); }
            }
        }

        protected void loadPCPINames(string comboName,string locID)
        {
            DataTable dt1 = new DataTable();
            SqlConnection cn1 = null;

            try
            {
                cn1 = new SqlConnection(connstr1);
                cn1.Open();

                //SqlDataAdapter sda2 = new SqlDataAdapter("SELECT [lastName] , [personId] FROM [PersonalInfo] WHERE [locationId] = '" + locID + "'", cn1);
                SqlDataAdapter sda2 = new SqlDataAdapter("SELECT [lastName] + ' , ' + [firstName] as pcLastName, [lastName] + ' , ' + [firstName] as piLastName, [personId] FROM [PersonalInfo] WHERE [locationId] = '" + locID + "'", cn1);

                sda2.Fill(dt1);

                if (comboName == "cbPCName")
                {
                cbPCName.DataTextField = "pcLastName";
                cbPCName.DataValueField = "personId";
                cbPCName.DataSource = dt1;
                cbPCName.DataBind();
                cbPCName.SelectedValue = "personId";
                //cbPCName.SelectedValue = DataBinder.Eval(Container, "DataItem.personId");
                }
                else if (comboName == "cbPIName")
                {
                    cbPIName.DataTextField = "piLastName";
                    cbPIName.DataValueField = "personId";
                    cbPIName.DataSource = dt1;
                    cbPIName.DataBind();
                    cbPIName.SelectedValue = "personId";
                }

            }
            catch (SqlException ex) { Console.WriteLine(ex); }
            finally
            {
                if (cn1 != null)
                { cn1.Close(); }
            }
        }

[Simon]

Hi Amirtha S,

Since you are using DataBinder.Eval to assign the SelectedValue property of the RadComboBoxes, you will need to manually supply these values back to the data source for its Insert operation.

I suggest you handle the Inserting event of the data source and populate the required parameters (first, find the RCBs from the Grid Insert Item).

I hope this helps.

Kind regards,
Simon
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.