CascadingDropDownProperties - Setting SelectedValue dynamically

I have an application where I am using the CascadingDropDown Lists. I have incorporated a set of them into a control.

I want to add a property to my CascadingDropDownProperties that will set an initial "filter" for my list.

For example, if I were using the sample CDD provided on the website that gives Make, Model, Color in my application, I may want to tell my control to only select foreign or domestic makes. At this point, the control can continue on to do what it needs to.

My web method is calling a MS-SQL stored procedure, and it has an input parameter of foreign/domestic (CarClass) for selecting the available Makes.

My questions on this are as follows:

How do I set up my CascadingdropDownProperties to add the Foreign/Domestic (CarClass) value?

How do I set this value in the code-behind?

(I will omit my actual DropDownLists from my code.)

Here is my CascadingDropDown definition:

1 <atlasToolkit:CascadingDropDown ID="CascadingDropDown1" runat="server">
2 <atlasToolkit:CascadingDropDownProperties
3 Category="CarClass"
4 ServicePath="~/wsSelectCar_Data.asmx" />
5
6 <atlasToolkit:CascadingDropDownProperties
7 TargetControlID="ddlMake"
8 Category="Make"
9 PromptText="Please select a Make"
10 ServiceMethod="GetMakes"
11 ServicePath="~/wsSelectCar_Data.asmx" />
12
13 <atlasToolkit:CascadingDropDownProperties
14 TargetControlID="ddlModel"
15 ParentControlID="ddlMake"
16 Category="Model"
17 PromptText="Please select a Model"
18 ServiceMethod="GetModel"
19 ServicePath="~/wsSelectCar_Data.asmx" />
20
21 <atlasToolkit:CascadingDropDownProperties
22 TargetControlID="ddlColor"
23 ParentControlID="ddlMake"
24 Category="Color"
25 PromptText="Please select a Color"
26 ServiceMethod="GetColor"
27 ServicePath="~/wsSelectCar_Data.asmx" />
28 </atlasToolkit:CascadingDropDown>

As you can see, I tried to create a property with the Category "CarClass". My Code-behind has the following to try to set the value:

1 int intCarClass =int.Parse(Session["CarClass"].ToString());
2 this.CascadingDropDown1.TargetProperties[0].SelectedValue = intCarClass.ToString();

This does not seem to work.

Thanks,
Bryan

Hi Bryan,

I'd recommend you switch to a page method and then just check whether or not you should apply the additional filter however you want.

Thanks,
Ted

Can you provide sample code for doing this?

I am not familiar with the "Page" methods.

Thanks.

CascadingDropDownProperties - Creating an extra Category/Value through code

I need to add an initial "filter" to my CascadingDropDown Lists.

How do I create a Property, and assign a value and category to it through code?

Thank you,

Bryan

I'm afraid I don't understand - could you please rephrase the question?

CascadingDropDownList - Adding KnownCategoryValues through code

I am using several Cascading Drop Down Lists.

Is there a way that I can add values to the knownCategoryValues and category parameters that get passed to the webmethods?

For example:

[

WebMethod(EnableSession =true)]
publicCascadingDropDownNameValue[] GetSkill(
string knownCategoryValues,
string category)
{
int SubSystem_ID =int.Parse(Session["PageSubSystem"].ToString());
StringDictionary kv =CascadingDropDown.ParseKnownCategoryValuesString(knownCategoryValues);

int Location_ID;
if (!kv.ContainsKey("Location") || !int.TryParse(kv["Location"],out Location_ID))
{
returnnull;
}

Sorry for the badly formatted code, but the Code Entry thing is not working.

Anyway, how would I add a "Key" of Location to the parameters? Would this have to be in the WebService, or can I add it from the web page?

Any help on this would be greatly appreciated!

Try to take a look at the following link about how to useAjax:CascadingDropDown with a Database for reference.
http://ajax.alpascual.com/Walkthrough/CCDWithDB.aspx
Wish this can help you.

CascadingDropDown Work only locally

HI,

I basically followed the sample toolkitCascadingdropdown. i only need 2 dropdown lists - Country and State.

everything works find on both local and live server. but when I'm calling the webservice from another website it has problems - a javascript error

<asp:DropDownList ID="ddlCountry" runat="server" />
<asp:DropDownList ID="ddlState" runat="server" />

<ajaxtoolkit:cascadingdropdown id="CascadingDropDown1" runat="server" category="State" loadingtext="Please wait..." parentcontrolid="ddlCountry" prompttext="Select a country"
servicemethod="GetStatByCountryID" servicepath="http://www.domainname.com/WebService/AddressService.asmx" targetcontrolid="ddlState">
</ajaxtoolkit:cascadingdropdown>

all sample I've seen is for working locally - both dropdownlists and webservice are sitting in the same website.

wondering if anyone can show me show to implement this cascadingdropdown by calling an external webservice

much appreciated

Hi,

So your intention is to call a external web service?

XmlHttpRequest object can't access external web service directly for security reasons. So, you may achieve this by adding a web service in the same domain, and this web service calls the external service. On client side, use this new web service to access the external web service indirectly.

Hope this helps.

This is exactly what I did, works out perfectly.

I created a local webserivce calling the external one.

much appreciated for your reply.

CascadingDropDown without PromptText - possible?

I put together a simple demo with two lists, and everything works fine when they both have the PromptText property set. When I leave the PromptText property empty on the parent list, it doesn't work - the parent list is disabled, and the user can't change the selection.

Since I always have a default selection for the parent list, I don't want the PromptText property to be set. Am I missing something?

Hi tomers,

In your case , if you set PromptText property to be empty, please set LoadingText property to be empty too. Just like below:

<cc1:CascadingDropDown ID="CascadingDropDown1" runat="server" TargetControlID="dlState"
Category="State" ServicePath="../WebService/CityServiceOledb.asmx" ServiceMethod="GetStates">

Here is the source code section of CascadingDropDown(from line 170 to 272),which indicates why it is disabled:

_setOptions : function(list, inInit, gettingList) {
/// <summary>
/// Set the contents of the DropDownList to the specified list
/// </summary>
/// <param name="list" mayBeNull="true" elementType="Object">
/// Array of options (where each option has name and value properties)
/// </param>
/// <param name="inInit" type="Boolean" optional="true">
/// Whether this is being called from the initialize method
/// </param>
/// <param name="gettingList" type="Boolean" optional="true">
/// Whether we are fetching the list of options from the web service
/// </param>
/// <returns />

if (!this.get_isInitialized()) {
return;
}

var e = this.get_element();
// Remove existing contents
this._clearItems();

// Populate prompt text (if available)
var headerText;
if (gettingList && this._loadingText) {
headerText = this._loadingText;
} else if (this._promptText) {
headerText = this._promptText;
}
if (headerText) {
var optionElement = new Option(headerText, "");
e.options[e.options.length] = optionElement;
}

// Add each item to the DropDownList, selecting the previously selected item
var selectedValueOption = null;
var defaultIndex = -1;

if (list) {
for (i = 0 ; i < list.length ; i++) {
var listItemName = list[i].name;
var listItemValue = list[i].value;

if (list[i].isDefaultValue) {
defaultIndex = i;
if (this._promptText) {
// bump the index if there's a prompt item in the list.
//
defaultIndex++;
}
}

var optionElement = new Option(listItemName, listItemValue);
if (listItemValue == this._selectedValue) {
selectedValueOption = optionElement;
}

e.options[e.options.length] = optionElement;
}
if (selectedValueOption) {
selectedValueOption.selected = true;
}
}

// if we didn't match the selected value, and we found a default
// item, select that one.
//
if (selectedValueOption) {
// Call set_SelectedValue to store the text as well
this.set_SelectedValue(e.options[e.selectedIndex].value, e.options[e.selectedIndex].text);
} else if (!selectedValueOption && defaultIndex != -1) {
e.options[defaultIndex].selected = true;
this.set_SelectedValue(e.options[defaultIndex].value, e.options[defaultIndex].text);
} else if (!inInit && !selectedValueOption && !gettingList) {
this.set_SelectedValue('', '');
}

if (e.childDropDown && !gettingList) {
for(i = 0; i < e.childDropDown.length; i++) {
e.childDropDown[i]._onParentChange();
}
}
else {
if (list && (Sys.Browser.agent !== Sys.Browser.Safari) && (Sys.Browser.agent !== Sys.Browser.Opera)) {
// Fire the onchange event for the control to notify any listeners of the change
if (document.createEvent) {
var onchangeEvent = document.createEvent('HTMLEvents');
onchangeEvent.initEvent('change', true, false);
this.get_element().dispatchEvent(onchangeEvent);
} else if( document.createEventObject ) {
this.get_element().fireEvent('onchange');
}
}
}

// Disable the control if prompt text is present and an empty list was populated
if (headerText) {
e.disabled = !list || (0 == list.length);
}

this.raisePopulated(Sys.EventArgs.Empty);
},

For more details , you can press F11(by default) to debug your application step-by-step or add break points by using ScriptExplorer.

Hope it helps. If I misunderstood you , please let me know.

I'll chec that out. Is there any reason for this limitation? Why can't I have a LoadingText without a PromptText?

Thanks!

Hi tomers,

Has your problem been resovled yet?

tomers:

Is there any reason for this limitation? Why can't I have a LoadingText without a PromptText?

So far I haven't find any documents to explain this issue.Based on my research, I think the reason is that PromptText property is recommended not to set to empty by design pattern. We emptied the LoadingText and PromptText properties, it will made DropDownList.disable = false.

For more details, we can add break points into the source code and debug it step-by-step.

CascadingDropDown Lists [Method Error 500]

Hi All,

I have recently started to learn AJAX, as well as all web developing. I am trying to read a database using a web service to populate drop down lists. I have searched through hundreds of posts and tried everything I found. The most common fix I found was to add System.Web.Script.Services.ScriptService before my class and System.Web.Script.Services.ScriptMethod before my WebMethod. I've tried upping my maxjsonlength. But these haven't fixed my problem. My problem being that on my development machine the app works fine, but on my webserver I get the Method Error 500. It seems like it can't find the asmx file, because, to see if it would even return anything, I took out the database read and put in bogus output.

Could my server be missing some key element to run AJAX? I have installed the Extentions on it. Is there something I have to do to deploy or publish the app? I have been just copying over all the files in my project.

I tried to put a call to the webservice in a page level method like they did on the How do I: cascading .. video, but that didn't work. I received a "BC30002: Type WebService not defined" Error. So that brings me back to thinking the app can't find the asmx file.

Anyone have any ideas?! Thanks for the help!

asmx file code:

Imports System.Web

Imports System.Web.Services

Imports System.Web.Services.Protocols

Imports AjaxControlToolkit

Imports System.Collections.Generic

Imports System.Data<WebService(Namespace:="http://tempuri.org/")> _

<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _

<Global.Microsoft.VisualBasic.CompilerServices.DesignerGenerated()> _

<System.Web.Script.Services.ScriptService()> _

PublicClass WebServiceInherits System.Web.Services.WebService

<WebMethod()> _

<System.Web.Script.Services.ScriptMethod()> _

PublicFunction GetCategory(ByVal knownCategoryValuesAsString,ByVal categoryAsString)As CascadingDropDownNameValue()

Dim myListAsNew List(Of CascadingDropDownNameValue)

Dim adapterAsNew DataSet1TableAdapters.sp_GetCategory1TableAdapter

myList.Add(New CascadingDropDownNameValue("test","test"))

Return myList.ToArray

'For Each dr As DataRow In adapter.GetCategory1

' myList.Add(New CascadingDropDownNameValue(dr("Category1").ToString, dr("Category1").ToString))

'Next

'Return myList.ToArray

EndFunction

EndClass

aspx file code:

<%@dotnet.itags.org.PageLanguage="VB"AutoEventWireup="true"CodeFile="Default.aspx.vb"Inherits="_Default"EnableEventValidation="false" %>

<%@dotnet.itags.org.RegisterAssembly="AjaxControlToolkit"Namespace="AjaxControlToolkit"TagPrefix="cc1" %> 'DO I REALLY NEED THIS LINE?

<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.1//EN""http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<htmlxmlns="http://www.w3.org/1999/xhtml">

<headrunat="server">

<title>Untitled Page</title>

</head>

<body>

<formid="form1"runat="server">

<asp:ScriptManagerID="ScriptManager1"runat="server"/>

<br/>

<br/>

<div>

<asp:UpdatePanelID="UpdatePanel1"runat="server">

<ContentTemplate>

<asp:DropDownListID="DropDownList1"runat="server"Width="232px">

</asp:DropDownList><br/>

<br/>

<br/>

<cc1:CascadingDropDownID="CascadingDropDown1"runat="server"Category="cat1"LoadingText="Loading..."

PromptText="Select Category"ServiceMethod="GetCategory"ServicePath="WebService.asmx"

TargetControlID="DropDownList1">

</cc1:CascadingDropDown>

<br/>

<br/>

</ContentTemplate>

</asp:UpdatePanel>

</div>

</form>

</body>

</html>

Thanks Again!

Princess

Well, I figured it out. Turns out I had my folders in the wrong place. The way I was referencing the webservice, the App_Code file, App_Data, & Bin folders plus the web.config file have to be at the top level of your application folder.

Mystery Solved!

Thats nice..So mark the answer, so it will help for otheres.

CascadingDropDown List functionality anomalie

I have a bizarre problem I am not sure how to go about solving. I have a relatively complicated page that uses 2 cascading drop down lists (category, child category) to determine what records will be displayed in a GridView which can then be edited in a DetailsView control. The functionality works 100% in my development environment, but for some odd reason it breaks on my beta server. I had this same problem with a CalendarExtender control (which I swapped for an older JavaScript version to rectify) where the Calendar popup would not popup on my beta server, but worked 100% on my local environment. I downloaded the latest release ajaxtoolkit dll and associated files and updated my bin folder to no avail. Is there something I am missing? Why would my beta server function differently here?

Any thoughts on what I should check would be helpful. If it works on my local environment, I am lead to believe it is some kind of AJAX configuration problem and not a code issue.

Thanks in advance.

-Jeremy

Just in case anyone else runs into a similar issue, it turns out there was a bizarre issue with the AJAX Extensions installation. While I had installed the latest version of the AJAX Extensions and the GAC reported the latest as well, there was apparently a conflict within the Temporary files folder for the 2.0 Framework. See the following thread where I found the answer:

http://forums.asp.net/p/1123792/1772068.aspx