CascadingDropDown without WebServices

one of the new thing in the new release is that:

"CascadingDropDown can now call PageMethod as well as web services (Just leave the ServicePath property blank)"

is it possible to add an example so I can start, please...

I have all in a Class, and it work fine but I wonder if I can do this without postback's

http://portal.filterqueen.dk/

the country dd is populate from a Class function called
getAllCountries( ByVal dd as DropDownList )

the Offices are populate almost the same
getAllOfficesFromCountry( ByVal dd as DropDownList, ByVal country as String )

How can I ask for this functions and send it the parameters in the new CascadingDropDown?

Hi Bruno,

The newest version of the Toolkit includes an example of doing this in the CascadingDropDown.aspx file of the sample website. You'll notice that there are three Cascading DropDowns on the page and the first calls a page method while the second two call a webservice.

Thanks,
Ted

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.