Saturday, March 24, 2012

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.

No comments:

Post a Comment