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

Cascade Combos & Javascript Errors

4 Answers 121 Views
ComboBox
This is a migrated thread and some comments may be shown as answers.
Jim
Top achievements
Rank 1
Jim asked on 24 Oct 2008, 03:04 PM
I have the following controls on my aspx page:

<

 

telerik:RadComboBox 
    
ID="edtSubDisciplineID" 
    
runat="server" 
    
Width="100%"
     
DataTextField="disciplineName" 
    
DataValueField="disciplineID" 
    Skin="Vista" 
    
OnClientSelectedIndexChanging="loadCostCodes" >
</telerik:RadComboBox>

 

<

 

telerik:RadComboBox 
    ID="edtCostCodeID" 
    runat="server" 
    Width="100%"
    DataTextField="costCodeFullName"
    DataValueField="costCodeID"
    Skin="Vista"
    EnableLoadOnDemand="true"
    OnItemsRequested="onCostCodeItemsRequested">
</telerik:RadComboBox>

 

 

 

and then, I've got the following Javascript on the same page:

<script type="text/javascript">
    function
loadCostCodes(item) 
    {
        var
ctrl = <%= edtCostCodeID.ClientID %>; 
        if
(item.Index > 0)
        {
            ctrl.requestItems(item.Value,
false
);
        }
        
else
        
{
            ctrl.Items = [];
            ctrl.setText(
" "
);
            ctrl.clearItems();
        }
}
</script
>

 

Problem:

When I change the selected item in the parent combo, I get the following javascript error:
    "Object doesn't support this property or method"

The problem occurs on the "item.Index" line, as well as the "ctrl.requestItems()" call.  I have tried upper and lowercase.  I have put alert() calls in there and verified I have the control is found properly.   I have verified that "item" passed into the javascript call is not null.

So, what am I missing?  I have been thru the tutorials and forums messages to no avail.  I am simply trying to get a parent/child cascading dropdown to work.  Your help is appreciated!

Jim

 

4 Answers, 1 is accepted

Sort by
0
Simon
Telerik team
answered on 24 Oct 2008, 03:16 PM
Hi Jim,

Please see this help topic for more information as well as this live demo showing the correct implementation of the approach.

All the best,
Simon
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Jim
Top achievements
Rank 1
answered on 24 Oct 2008, 03:36 PM
Thanks for your help, Simon. 

My problem is resolved!

Jim
0
jincy
Top achievements
Rank 1
answered on 28 Oct 2008, 11:12 AM
Hi,

I am also using the same approach which is described in this http://demos.telerik.com/aspnet/prometheus/ComboBox/Examples/Functionality/MultipleComboBoxes/DefaultCS.aspx.

My problem is I want to use this same approach in different pages, so I was trying to create a common javascript function for OnClientrequestingcountries and others( means which does not include any hardcoded control names inside the javascript). Some how I created one js function but it is getting errors. Can anyone help me to create one?



Regards,
Jincy
0
Simon
Telerik team
answered on 28 Oct 2008, 03:56 PM
Hello jincy,

You can handle the OnClientLoad of the Countries and Cities ComboBoxes to store a global reference of each.

Then you can use these references directly in the JavaScript functions.

Below is the content of the attached MultipleComboBox.js file:

var countriesComboBox = null
var citiesComboBox = null
 
function countriesComboBoxLoad(sender, eventArgs) { 
    countriesComboBox = sender; 
 
function citiesComboBoxLoad(sender, eventArgs) { 
    citiesComboBox = sender; 
 
function loadCountries(sender, eventArgs) 
{    
    var item = eventArgs.get_item(); 
     
    countriesComboBox.set_text("Loading..."); 
    citiesComboBox.clearSelection(); 
     
    if (item.get_index() > 0) 
    {        
        countriesComboBox.requestItems(item.get_value(), false);                                 
    } 
    else 
    { 
        countriesComboBox.set_text(" "); 
        countriesComboBox.clearItems(); 
         
        citiesComboBox.set_text(" "); 
        citiesComboBox.clearItems(); 
    } 
 
function loadCities(sender, eventArgs) 
{    
    var item = eventArgs.get_item(); 
     
    citiesComboBox.set_text("Loading..."); 
    citiesComboBox.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(); 

Greetings,
Simon
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Tags
ComboBox
Asked by
Jim
Top achievements
Rank 1
Answers by
Simon
Telerik team
Jim
Top achievements
Rank 1
jincy
Top achievements
Rank 1
Share this question
or