This is a migrated thread and some comments may be shown as answers.

RadGrid > EditFormType=WebUserControl > Dynamic DropDownLists

5 Answers 155 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Chris Tallos
Top achievements
Rank 1
Chris Tallos asked on 21 Sep 2009, 03:50 PM
I am using a RadGrid with an EditForm of Type WebUserControl.  My User Control contains a form which has three dropdowns (Country, StateRegion, City).  When a user selects Country then I query and return a list of StateRegion which would then be bound to a RadComboBox for StateRegion.  Then when the user selects StateRegion I would query and return a list of City which would then be bound to a RadComboBox for cities.  Please help me understand how to do this as it appears as though the SelectedIndexChanged and/or TextChanged methods are not being called in my user control, only the Page events are getting called.

5 Answers, 1 is accepted

Sort by
0
Princy
Top achievements
Rank 2
answered on 22 Sep 2009, 05:09 AM
Hi Chris Tallos,

Go through the following online demo which demonstrates on how comboboxes on a page can interact with each other using client-side methods and requesting the items on demand. I'm sure this is close to what you are looking for:
Related ComboBoxes

Thanks
Princy.
0
Chris Tallos
Top achievements
Rank 1
answered on 22 Sep 2009, 02:11 PM
Princy,

Thank you for the example. I was able to put this in a seperate project from my own and it ran perfectly.  However, when I implemented this inside my user control which is the Editform for my RadGrid it fails with "Microsoft JScript runtime error: 'LoadStates' is undefined". Here is my code for the UserControl. The codebehind is not far off from what you have shown me.  The trick is this control is an editform for a radgrid. I think it has something to do with containers.

 

 

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> 
<%@ Control Language="C#" AutoEventWireup="true" CodeFile="ModalAddUpdate.ascx.cs" 
    Inherits="Admin_Controls_ModalAddUpdate" %> 
<script type="text/javascript">  
    //global variables for the countries and cities comboboxes  
    var countryCombo;  
    var stateCombo;  
    var citiesCombo;  
 
    function pageLoad() {  
        debugger;  
        // initialize the global variables  
        // in this event all client objects  
        // are already created and initialized  
        countryCombo = $find("<%= rcbValidateCountry.ClientID %>");  
        stateCombo = $find("<%= rcbStateRegion.ClientID %>");  
        citiesCombo = $find("<%= rcbCity.ClientID %>");  
    }  
 
    function LoadStates(combo, eventArqs) {  
        debugger;  
        var item = eventArqs.get_item();  
        stateCombo.set_text("Loading...");  
        citiesCombo.clearSelection();  
 
        // if a continent is selected  
        if (item.get_index() > 0) {  
            // this will fire the ItemsRequested event of the   
            // states combobox passing the countryId as a parameter   
            stateCombo.requestItems(item.get_value(), false);  
        }  
        else {  
            // the -Select a continent- item was chosen  
            stateCombo.set_text(" ");  
            stateCombo.clearItems();  
 
            citiesCombo.set_text(" ");  
            citiesCombo.clearItems();  
        }  
    }  
 
    function LoadCities(combo, eventArqs) {  
 
        debugger;  
        var item = eventArqs.get_item();  
        var val = countryCombo.get_value();  
 
        citiesCombo.set_text("Loading...");  
        // this will fire the ItemsRequested event of the  
        // cities combobox passing the stateId as a parameter   
        citiesCombo.requestItems(item.get_value(), false);  
    }  
 
    function ItemsLoaded(combo, eventArqs) {  
        if (combo.get_items().get_count() > 0) {  
            // pre-select the first item  
            combo.set_text(combo.get_items().getItem(0).get_text());  
            combo.get_items().getItem(0).highlight();  
        }  
        //combo.showDropDown();  
    }  
 
</script> 
<table> 
    <tr style="height: 25px">  
        <td style="width: 250px;">  
            <asp:Label ID="lblAddressLineOne" runat="server" Text="Address Line One:"></asp:Label> 
        </td> 
        <td width="5px">  
            &nbsp;  
        </td> 
        <td align="left">  
            <asp:TextBox ID="txtAdressLineOne" runat="server" Width="300px"></asp:TextBox><asp:RequiredFieldValidator  
                ID="RequiredFieldValidator1" runat="server" ErrorMessage="RequiredFieldValidator" 
                ControlToValidate="txtAdressLineOne">*</asp:RequiredFieldValidator> 
        </td> 
    </tr> 
    <tr style="height: 25px">  
        <td style="width: 250px;">  
            <asp:Label ID="lblAddressLineTwo" runat="server" Text="Address Line Two:"></asp:Label> 
        </td> 
        <td width="5px">  
            &nbsp;  
        </td> 
        <td align="left">  
            <asp:TextBox ID="txtAddressLineTwo" runat="server" Width="300px"></asp:TextBox> 
        </td> 
    </tr> 
    <tr style="height: 25px">  
        <td style="width: 250px;">  
            <asp:Label ID="lblValidateCountry" runat="server" Text="Country:"></asp:Label> 
        </td> 
        <td width="5px">  
            &nbsp;  
        </td> 
        <td align="left">  
            <telerik:RadComboBox ID="rcbValidateCountry" runat="server" DataTextField="ValidateCountryCommonName" 
                DataValueField="ValidateCountryId" OnClientSelectedIndexChanging="LoadStates" 
                OnItemsRequested="rcbValidateCountry_ItemsRequested">  
            </telerik:RadComboBox> 
            <asp:RequiredFieldValidator ControlToValidate="rcbValidateCountry" ID="RequiredFieldValidator4" 
                runat="server" ErrorMessage="RequiredFieldValidator">*</asp:RequiredFieldValidator> 
        </td> 
    </tr> 
    <tr style="height: 25px">  
        <td style="width: 250px;">  
            <asp:Label ID="lblValidateStateRegion" runat="server" Text="State/Region:"></asp:Label> 
        </td> 
        <td width="5px">  
            &nbsp;  
        </td> 
        <td align="left">  
            <telerik:RadComboBox ID="rcbStateRegion" runat="server" Width="205px" DataTextField="ValidateProvinceStateRegionName" 
                DataValueField="ValidateProvinceStateRegionId" OnClientSelectedIndexChanging="LoadCities" 
                OnClientItemsRequested="ItemsLoaded" OnItemsRequested="rcbStateRegion_ItemsRequested">  
            </telerik:RadComboBox> 
            <asp:RequiredFieldValidator ControlToValidate="rcbStateRegion" ID="RequiredFieldValidator2" 
                runat="server" ErrorMessage="RequiredFieldValidator">*</asp:RequiredFieldValidator> 
        </td> 
    </tr> 
    <tr style="height: 25px">  
        <td style="width: 250px;">  
            <asp:Label ID="lblCity" runat="server" Text="City:"></asp:Label> 
        </td> 
        <td width="5px">  
            &nbsp;  
        </td> 
        <td align="left">  
            <telerik:RadComboBox ID="rcbCity" runat="server" Width="205px" DataTextField="ValidateWorldCityFormalName" 
                DataValueField="ValidateWorldCityId" OnClientItemsRequested="ItemsLoaded" OnItemsRequested="rcbCity_ItemsRequested">  
            </telerik:RadComboBox> 
            <asp:RequiredFieldValidator ControlToValidate="rcbCity" ID="RequiredFieldValidator3" 
                runat="server" ErrorMessage="RequiredFieldValidator">*</asp:RequiredFieldValidator> 
        </td> 
    </tr> 
    <tr style="height: 25px">  
        <td style="width: 250px;">  
            <asp:Label ID="lblZipPostal" runat="server" Text="Zip/Postal Code:"></asp:Label> 
        </td> 
        <td width="5px">  
            &nbsp;  
        </td> 
        <td align="left">  
            <telerik:RadMaskedTextBox ID="RadMaskedTextBox1" runat="server" Mask="#####-####" 
                TextWithLiterals="-" Width="125px">  
            </telerik:RadMaskedTextBox> 
        </td> 
    </tr> 
    <tr> 
        <td colspan="3" style="text-align: right;">  
            <asp:Button ID="cmdSave" runat="server" Text="Save" /> 
            <asp:Button ID="cmdCancel" runat="server" CausesValidation="false" Text="Cancel" /> 
        </td> 
    </tr> 
</table> 

 

 

 

 

 

0
Shaishav Karnani
Top achievements
Rank 1
answered on 02 Apr 2010, 01:36 PM
Hi,

I am also facing similar issue when using it in a Edit Mode of RadGrid. Edit Mode calls User Control.

Please advice.

Cheers,
Shaishav
0
Kiran
Top achievements
Rank 1
answered on 19 Aug 2010, 01:10 PM
I am facing this issue too... any soln you found for this?
0
Kiara
Top achievements
Rank 1
answered on 23 Aug 2010, 03:44 PM
Guys, I found code library project here which does what you are aiming for with EditItemTemplate. In my case I tested the code with WebUserControl RadGrid edit form and it worked as advertised as well.

Kiara
Tags
Grid
Asked by
Chris Tallos
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 2
Chris Tallos
Top achievements
Rank 1
Shaishav Karnani
Top achievements
Rank 1
Kiran
Top achievements
Rank 1
Kiara
Top achievements
Rank 1
Share this question
or