fit-ui 2.5.0 → 2.5.4

package/dist/Fit.UI.css

@@ -3854,7 +3854,7 @@ div.FitUiControlDropDown[data-selectionmodetoggle="true"]
 
 /* WSDropDown: Action Menu (ListView) */
 
-div.FitUiControlDropDown span.FitUiControlDropDownActionMenuItemDelete
+div.FitUiControlDropDown span.FitUiControlDropDownActionMenuItemIconDelete
 {
 	color: #DB1E1E;
 }

package/dist/Fit.UI.js

@@ -648,7 +648,7 @@ Fit._internal =
 {
 	Core:
 	{
-		VersionInfo: { Major: 2, Minor: 5, Patch: 0 } // Do NOT modify format - version numbers are programmatically changed when releasing new versions - MUST be on a separate line!
+		VersionInfo: { Major: 2, Minor: 5, Patch: 4 } // Do NOT modify format - version numbers are programmatically changed when releasing new versions - MUST be on a separate line!
 	}
 };
 
@@ -17177,9 +17177,7 @@ Fit.Controls.DropDown = function(ctlId)
 
 		inp.value = "";
 
-		Fit.Dom.Data(inp.parentElement, "editing", null);
-		Fit.Dom.Data(inp, "editing", null);
-		me._internal.Repaint();
+		setInputEditing(inp, false);
 
 		if (inp === txtActive)
 			prevValue = "";
@@ -17199,22 +17197,31 @@ Fit.Controls.DropDown = function(ctlId)
 	{
 		Fit.Validation.ExpectString(val);
 
-		if (txtActive.value === val)
-			return;
+		var txt = txtActive;
+		var fireOnChange = txt.value !== val;
+
+		if (focusAssigned === false && txt !== txtPrimary)
+		{
+			// DropDown does not have focus, and the currently active input field
+			// is not the primary one. Change it to the primary input field instead.
 
-		txtActive.value = "";
+			// Clear active input field in case it has a value
+			txtActive.value = "";
+			setInputEditing(txtActive, false);
 
-		Fit.Dom.Data(txtActive.parentElement, "editing", val !== "" ? "true" : null);
-		Fit.Dom.Data(txtActive, "editing", val !== "" ? "true" : null);
-		me._internal.Repaint();
+			txt = txtPrimary;
+			txtActive = txtPrimary;
+		}
 
-		var txt = ((focusAssigned === true) ? txtActive : txtPrimary);
+		setInputEditing(txt, val !== "");
 
 		txt.value = val;
 		prevValue = val;
-		txtActive = txt;
 
-		fireOnInputChanged(txt.value);
+		if (fireOnChange === true)
+		{
+			fireOnInputChanged(txt.value);
+		}
 	}
 
 	/// <function container="Fit.Controls.DropDown" name="GetInputValue" access="public" returns="string">
@@ -17254,6 +17261,11 @@ Fit.Controls.DropDown = function(ctlId)
 		if (Fit._internal.DropDown.Current !== null && Fit._internal.DropDown.Current !== me)
 			Fit._internal.DropDown.Current.CloseDropDown();
 
+		if (txtActive === txtPrimary && me.GetInputValue() === "")
+		{
+			me._internal.UndoClearInputForSearch();
+		}
+
 		// Do this before displaying drop down to prevent dropdown with position:absolute
 		// from changing height of document which may cause page to temporarily scroll, hence
 		// result in incorrect measurement of control position in optimizeDropDownPosition().
@@ -17434,28 +17446,54 @@ Fit.Controls.DropDown = function(ctlId)
 
 	this._internal = (this._internal ? this._internal : {});
 
-	// Clear input field without firing OnInputChanged, and make placeholder appear
-	this._internal.ClearInputAndShowPlaceholder = function(forceFocusInput)
+	this._internal.ClearInputForSearch = function()
 	{
-		Fit.Validation.ExpectBoolean(forceFocusInput, true);
+		if (me.TextSelectionMode() === true)
+		{
+			forceFocusInput(txtPrimary);
+			txtPrimary.value = "";
+			updatePlaceholder(true);
+		}
+		else
+		{
+			forceFocusInput(txtPrimary);
+			me.ClearInput();
+			setInputEditing(txtPrimary, true);
+		}
 
-		txtPrimary.value = "";
-		updatePlaceholder(true);
+		// If DropDown is in Visual Selection Mode, the search field is now displayed
+		// on a separate "line" (see code above where setInputEditing(..) is called).
+		// When that input field lose focus, it will immediately return to its normal
+		// state. This results in the control's height changing which in turn results
+		// in the pulldown menu moving up. So if a user clicks an item in the pulldown
+		// menu, the input lose focus, the position of the pulldown menu changes, and
+		// nothing happens from the click because the picker uses a traditional onclick
+		// event to register interactions, which doesn't fire unless the mouse button is released
+		// on the same object it was pressed down on. We avoid this by closing the control.
+		// We close it in both Text Selection Mode and Visual Selection Mode for consistency.
+		me.CloseDropDown();
+	}
 
-		if (forceFocusInput)
+	this._internal.UndoClearInputForSearch = function()
+	{
+		if (me.TextSelectionMode() === true)
 		{
-			// By default focus is never assigned to input on mobile if user opened the
-			// DropDown by clicking the arrow icon. ForceFocusInput allows us to ignore this
-			// aspect. On desktop the input field always remains focused  as it automatically
-			// steals back focus immediately after interacting with a picker control. See
-			// picker.OnFocusIn handler registered in SetPicker(..)
-			var orgFocusInputOnMobile = focusInputOnMobile;
-			focusInputOnMobile = true;
-			focusInput(txtActive);
-			focusInputOnMobile = orgFocusInputOnMobile;
+			updateTextSelection(); // Also removes placeholder by calling updatePlaceholder(true)
+		}
+		else
+		{
+			me.ClearInput();
+			setInputEditing(txtPrimary, false);
 		}
 	}
 
+	// Focus input field on mobile and keep it focused, even if DropDown was opened using arrow icon
+	this._internal.ForceFocusMobile = function()
+	{
+		focusInputOnMobile = true;
+		focusInput(txtPrimary);
+	}
+
 	// ============================================
 	// Private
 	// ============================================
@@ -17492,9 +17530,7 @@ Fit.Controls.DropDown = function(ctlId)
 				prevValue = txt.value;
 				var pastedValue = txt.value;
 
-				Fit.Dom.Data(txt.parentElement, "editing", "true");
-				Fit.Dom.Data(txt, "editing", "true");
-				me._internal.Repaint();
+				setInputEditing(txt, true);
 
 				if (fireOnPaste(txt.value) === true)
 				{
@@ -17574,9 +17610,7 @@ Fit.Controls.DropDown = function(ctlId)
 
 			if (txt.value === "")
 			{
-				Fit.Dom.Data(txt.parentElement, "editing", null);
-				Fit.Dom.Data(txt, "editing", null);
-				me._internal.Repaint();
+				setInputEditing(txt, false);
 			}
 		}
 
@@ -17707,6 +17741,11 @@ Fit.Controls.DropDown = function(ctlId)
 
 				if (txt.value.length === 0)
 				{
+					if (txt === txtPrimary)
+					{
+						me._internal.UndoClearInputForSearch();
+					}
+
 					if (Fit.Browser.GetInfo().Name === "MSIE")
 						Fit.Events.PreventDefault(ev); // Do not navigate back on IE when backspace is pressed within input being removed
 
@@ -17776,9 +17815,7 @@ Fit.Controls.DropDown = function(ctlId)
 		{
 			updatePlaceholder(true, true); // Make sure placeholder is removed immediately on keystroke
 
-			Fit.Dom.Data(txt.parentElement, "editing", "true");
-			Fit.Dom.Data(txt, "editing", "true");
-			me._internal.Repaint();
+			setInputEditing(txt, true);
 		}
 
 		txt.onkeyup = function(e) // Fires only once when a key is released (unless suppressed in OnKeyDown)
@@ -17895,6 +17932,44 @@ Fit.Controls.DropDown = function(ctlId)
 			txtActive.focus(); // Notice: Input field's onfocus handler will move focus to txtPrimary if this is the last selection's right side input field - on mobile it might redirect focus to the arrow icon to avoid bringing up the virtual keyboard
 	}
 
+	function forceFocusInput(input)
+	{
+		Fit.Validation.ExpectInstance(input, HTMLInputElement);
+
+		// By default focus is never assigned to input on mobile if user opened the
+		// DropDown by clicking the arrow icon. ForceFocusInput allows us to ignore this
+		// aspect. On desktop the input field always remains focused  as it automatically
+		// steals back focus immediately after interacting with a picker control. See
+		// picker.OnFocusIn handler registered in SetPicker(..)
+		var orgFocusInputOnMobile = focusInputOnMobile;
+		focusInputOnMobile = true;
+		focusInput(input);
+		focusInputOnMobile = orgFocusInputOnMobile;
+	}
+
+	function setInputEditing(input, val, keepStateOnParent)
+	{
+		Fit.Validation.ExpectInstance(input, HTMLInputElement);
+		Fit.Validation.ExpectBoolean(val);
+		Fit.Validation.ExpectBoolean(keepStateOnParent, true);
+
+		if (keepStateOnParent !== true)
+		{
+			Fit.Dom.Data(input.parentElement, "editing", val === true ? "true" : null);
+		}
+
+		Fit.Dom.Data(input, "editing", val === true ? "true" : null);
+
+		if (input === txtPrimary)
+		{
+			// DropDown's placeholder is only displayed when no items are selected.
+			// Therefore, use native placeholder for input if items are selected.
+			txtPrimary.placeholder = val === true && me.GetSelections().length > 0 ? me.Placeholder() : "";
+		}
+
+		me._internal.Repaint();
+	}
+
 	function clearAllInputsButActive()
 	{
 		var inputs = itemContainer.getElementsByTagName("input");
@@ -17904,9 +17979,16 @@ Fit.Controls.DropDown = function(ctlId)
 			if (input === txtActive)
 				return;
 
-			if ((txtActive.parentElement === itemContainer && input === txtPrimary) || (txtActive.parentElement !== itemContainer && Fit.Dom.Contained(txtActive.parentElement, input) === false))
-				Fit.Dom.Data(input.parentElement, "editing", null);
-			Fit.Dom.Data(input, "editing", null);
+			if (txtActive.parentElement === input.parentElement)
+			{
+				// Input is contained in a selected object whose other input is txtActive.
+				// Do not remove editing state from parent element in this case - keep it!
+				setInputEditing(input, false, true);
+			}
+			else
+			{
+				setInputEditing(input, false);
+			}
 
 			me.ClearInput(input);
 		});
@@ -18449,7 +18531,7 @@ Fit.Controls.DropDown = function(ctlId)
 			Fit.Dom.SetCaretPosition(txtPrimary, 0);
 		}
 
-		// Remove placeholder in case it was added using this._internal.ClearInputAndShowPlaceholder()
+		// Remove placeholder in case it was added using this._internal.ClearInputForSearch()
 
 		updatePlaceholder(true);
 
@@ -19093,6 +19175,7 @@ Fit.Controls.WSDropDown = function(ctlId)
 	var hideLinesForFlatData = true;
 	var dataRequested = false;		// Flag indicating whether TreeView data has been requested or not - determines whether a call to ensureTreeViewData() actually loads data or not
 	var dataLoading = false;		// Flag indicating whether TreeView data is currently being loaded by WSDropDown internals (awaiting response) - will not be True when user expand nodes to load children, or when invoking e.g. dd.GetTreeView.Reload()
+	var nodesPopulated = false;		// Flag indicating whether TreeView root nodes have been populated - contrary to dataLoading this flag is set when a potentially partial portion of the data has been loaded
 	var requestCount = 0;			// Counter to keep track of nodes for which data is currently being loaded, no matter how it was being loaded (via WSDropDown internals, programmatically on WSTreeView from external code, or by user expanding nodes)
 	var onDataLoadedCallback = [];
 	var suppressTreeOnOpen = false;
@@ -19102,6 +19185,10 @@ Fit.Controls.WSDropDown = function(ctlId)
 	var autoUpdatedSelections = null; // Cached result from AutoUpdateSelected: [{ Title:string, Value:string, Exists:boolean }, ...]
 	var useActionMenu = false;
 	var useActionMenuForced = false;
+	var useActionMenuAfterLoad = true;
+	var treeViewEnabled = true;
+	var orgPlaceholder = this.Placeholder;
+	var customPlaceholderSet = false;
 	var translations = null;
 
 	var onRequestHandlers = [];
@@ -19126,7 +19213,7 @@ Fit.Controls.WSDropDown = function(ctlId)
 
 		// Create ListView
 
-		list = new Fit.Controls.WSListView(ctlId + "__WSListView");
+		list = new Fit.Controls.WSListView(me.GetId() + "__WSListView");
 		list.OnRequest(function(sender, eventArgs)
 		{
 			if (fireEventHandlers(onRequestHandlers, list, eventArgs) === false)
@@ -19178,7 +19265,7 @@ Fit.Controls.WSDropDown = function(ctlId)
 
 		// Create TreeView
 
-		tree = new Fit.Controls.WSTreeView(ctlId + "__WSTreeView");
+		tree = new Fit.Controls.WSTreeView(me.GetId() + "__WSTreeView");
 		tree.Selectable(true); // Make nodes selectable by default when added
 		tree.Width(100, "%");
 		//tree.Lines(true); // DISABLED - lines do not scale with font size
@@ -19218,22 +19305,6 @@ Fit.Controls.WSDropDown = function(ctlId)
 				{
 					fireOnDataLoaded();
 				}
-
-				// If no data is returned and DropDown is in TextSelectionMode, the user will
-				// not have an easy way to remove objects from the DropDown, unless SelectionModeToggle
-				// is true. Therefore we allow for items to be removed using an action menu.
-				// EDIT: Now displays action menu in both Visual and Text Selection Mode for consistency.
-
-				if (useActionMenuForced === false)
-				{
-					useActionMenu = eventArgs.Children.length === 0;
-				}
-
-				if (/*me.TextSelectionMode() === true &&*/ useActionMenu === true)
-				{
-					updateActionMenu();
-					me.SetPicker(actionMenu);
-				}
 			}
 		});
 		tree.OnAbort(function(sender, eventArgs)
@@ -19254,6 +19325,30 @@ Fit.Controls.WSDropDown = function(ctlId)
 		});
 		tree.OnPopulated(function(sender, eventArgs)
 		{
+			nodesPopulated = true;
+
+			// If no data is returned and DropDown is in TextSelectionMode, the user will
+			// not be able to remove objects from the DropDown, unless SelectionModeToggle
+			// is true. Therefore we allow for items to be removed using an action menu.
+			// EDIT: Now displays action menu in both Visual and Text Selection Mode for consistency.
+
+			if (useActionMenuForced === false)
+			{
+				useActionMenu = tree.GetChildren().length === 0;
+			}
+
+			if (/*me.TextSelectionMode() === true &&*/ useActionMenu === true)
+			{
+				updateActionMenu();
+
+				if (useActionMenuAfterLoad === true || tree.GetChildren().length === 0)
+				{
+					me.SetPicker(actionMenu);
+				}
+			}
+
+			// Helper lines
+
 			if (hideLinesForFlatData === true && tree.Lines() === true) // Lines are off by default but might have been enabled like so: dd.GetTreeView().Lines(true)
 			{
 				// Disable helper lines if no children are contained
@@ -19328,16 +19423,21 @@ Fit.Controls.WSDropDown = function(ctlId)
 
 		var skipUpdateActionMenuOnChange = false;
 
-		actionMenu = new Fit.Controls.ListView(ctlId + "__ActionsListView");
+		actionMenu = new Fit.Controls.ListView(me.GetId() + "__ActionsListView");
 		actionMenu.OnSelect(function(sender, item) // Using OnSelect instead of OnItemSelectionChanging since DropDown fires OnItemSelectionChanging when selection is changed, which would result in OnItemSelectionChanging being executed multiple times
 		{
 			if (item.Value === "SearchMore")
 			{
-				me._internal.ClearInputAndShowPlaceholder(true); // NOTICE: TextSelectionMode only - Visual Selection Mode cannot be temporarily cleared to display the place holder
+				me._internal.ClearInputForSearch();
 			}
 			else if (item.Value === "ShowAll")
 			{
+				me._internal.UndoClearInputForSearch(); // In case user first picked SearchMore, changed their mind, and then selected ShowAll
+
+				useActionMenuAfterLoad = false;
+
 				me.SetPicker(tree);
+				ensureTreeViewData();
 			}
 			else if (item.Value === "RemoveAll")
 			{
@@ -19430,14 +19530,32 @@ Fit.Controls.WSDropDown = function(ctlId)
 				return;
 			}
 
-			if (useActionMenu === true)
+			// Do not show action menu if the only option available is ShowAll.
+			// In this case the user will not be able to select SeachMore, and
+			// there is no selected items that can be removed from the control.
+			// In this case we ignore useActionMenu === true, even when useActionMenuForced is true.
+			var onlyTheShowAllOptionIsDisplayedInActionMenu = actionMenu.GetItems().length === 1 && actionMenu.HasItem("ShowAll") === true;
+
+			if (useActionMenu === true && onlyTheShowAllOptionIsDisplayedInActionMenu === false)
 			{
 				me.SetPicker(actionMenu);
 			}
 			else
 			{
-				me.SetPicker(tree);
-				ensureTreeViewData();
+				if (onlyTheShowAllOptionIsDisplayedInActionMenu === true)
+				{
+					useActionMenuAfterLoad = false;
+				}
+
+				if (treeViewEnabled === true)
+				{
+					me.SetPicker(tree);
+					ensureTreeViewData();
+				}
+				else
+				{
+					list.RemoveItems(); // Do not show previous search results again
+				}
 			}
 		});
 
@@ -19506,6 +19624,7 @@ Fit.Controls.WSDropDown = function(ctlId)
 		}
 
 		dataLoading = true;
+		nodesPopulated = false;
 
 		var ensure = function()
 		{
@@ -19651,10 +19770,6 @@ Fit.Controls.WSDropDown = function(ctlId)
 		}
 	}
 
-	/// <function container="Fit.Controls.WSDropDown" name="MultiSelectionMode" access="public" returns="boolean">
-	/// 	<description> Get/set value indicating whether control allows for multiple selections simultaneously </description>
-	/// 	<param name="val" type="boolean" default="undefined"> If defined, True enables support for multiple selections, False disables it </param>
-	/// </function>
 	this.MultiSelectionMode = Fit.Core.CreateOverride(this.MultiSelectionMode, function(val)
 	{
 		Fit.Validation.ExpectBoolean(val, true);
@@ -19667,6 +19782,105 @@ Fit.Controls.WSDropDown = function(ctlId)
 		return base(val);
 	});
 
+	this.InputEnabled = Fit.Core.CreateOverride(this.InputEnabled, function(val)
+	{
+		Fit.Validation.ExpectBoolean(val, true);
+
+		if (Fit.Validation.IsSet(val) === true && base() !== val)
+		{
+			base(val);
+			localize(); // Add/remove placeholder depending on whether input is enabled or not - also calls updateActionMenu() which will make sure SearchMore action is added/removed depending on whether input is enabled or not
+
+			if (val === false && me.GetPicker() === list)
+			{
+				me.SetPicker(null); // Which picker to use is decided in the OnOpen handler
+			}
+		}
+
+		return base();
+	});
+
+	/// <function container="Fit.Controls.WSDropDown" name="TreeViewEnabled" access="public" returns="boolean">
+	/// 	<description> Get/set value indicating whether TreeView control is enabled or not </description>
+	/// 	<param name="val" type="boolean" default="undefined"> If defined, True enables TreeView (default), False disables it </param>
+	/// </function>
+	this.TreeViewEnabled = function(val)
+	{
+		Fit.Validation.ExpectBoolean(val, true);
+
+		if (Fit.Validation.IsSet(val) === true && val !== treeViewEnabled)
+		{
+			treeViewEnabled = val;
+
+			if (useActionMenuForced === false)
+			{
+				// Use action menu if there is no data to display
+
+				if (val === true)
+				{
+					useActionMenu = nodesPopulated === false || tree.GetChildren().length === 0;
+				}
+				else
+				{
+					useActionMenu = true; // User must search to retrieve available options
+				}
+			}
+
+			if (val === false && me.GetPicker() === tree)
+			{
+				me.SetPicker(null); // Which picker to use is decided in the OnOpen handler
+			}
+
+			updateActionMenu(); // Update action menu to have ShowAll action added/removed depending on whether TreeView is enabled or not
+		}
+
+		return treeViewEnabled;
+	}
+
+	/// <function container="Fit.Controls.WSDropDown" name="ListViewEnabled" access="public" returns="boolean">
+	/// 	<description>
+	/// 		Get/set flag indicating whether searchable ListView is enabled or not.
+	/// 		The value provided also determines the value for InputEnabled and vice versa.
+	/// 	</description>
+	/// 	<param name="val" type="boolean" default="undefined"> If defined, True enables ListView and search capability (default), False disables it </param>
+	/// </function>
+	this.ListViewEnabled = function(val)
+	{
+		Fit.Validation.ExpectBoolean(val, true);
+		return me.InputEnabled(val);
+	}
+
+	this.Placeholder = function(val)
+	{
+		Fit.Validation.ExpectString(val, true);
+
+		customPlaceholderSet = true;
+		return orgPlaceholder(val);
+	}
+
+	this.OpenDropDown = Fit.Core.CreateOverride(this.OpenDropDown, function()
+	{
+		if (me.InputEnabled() === true && me.GetInputValue() === "" && me.GetSelections().length === 0 && treeViewEnabled === false)
+		{
+			// Do not open DropDown - it will only contain "Search for more options"
+			// when no items are currently selected and TreeView is disabled, and no
+			// search value has been entered yet.
+			// The control will display "Search.." (or a custom placeholder), making it
+			// obvious what the user need to do to get data - no need to display the action menu.
+
+			if (Fit.Browser.GetInfo().IsMobile === true)
+			{
+				// Focus input on mobile, even if DropDown was opened using
+				// the arrow icon - this will bring up the virtual keyboard.
+				this._internal.ForceFocusMobile();
+			}
+
+			return;
+		}
+
+		base();
+	});
+
 	/// <function container="Fit.Controls.WSDropDown" name="GetListView" access="public" returns="Fit.Controls.WSListView">
 	/// 	<description> Get WSListView control used to display data in a flat list view </description>
 	/// </function>
@@ -19684,7 +19898,21 @@ Fit.Controls.WSDropDown = function(ctlId)
 	}
 
 	/// <function container="Fit.Controls.WSDropDown" name="UseActionMenu" access="public">
-	/// 	<description> Get/set value indicating whether control uses the built-in action menu to ease addition and removal of items </description>
+	/// 	<description>
+	/// 		Get/set value indicating whether control uses the built-in action menu to ease addition and removal of items.
+	/// 		If this property is not explicitly set, it will automatically be changed by the control depending on data and other settings.
+	/// 		The action menu will be enabled if TreeViewEnabled is set to False, as it would otherwise not show anything unless the user
+	/// 		enters a search value. If TreeViewEnabled is True but no data is provided to the TreeView control upon request, the action menu
+	/// 		is also enabled.
+	/// 		If the control does not have any selections, InputEnabled (or its alias ListViewEnabled) is True, and TreeViewEnabled is False,
+	/// 		no picker will be displayed since the action menu would only display the &quot;Search for options&quot; item - but it should already
+	/// 		be obvious to the user that searching is required due to the placeholder displaying &quot;Search..&quot; by default.
+	/// 		Likewise, if TreeViewEnabled is True and InputEnabled (or its alias ListViewEnabled) is False, and no selections are made,
+	/// 		the action menu would only display &quot;Show available options&quot;. In this case the TreeView will be displayed instead,
+	/// 		even if UseActionMenu has explicitely been set to True.
+	/// 		The behaviour described is in place to make sure the action menu is only displayed when it makes sense, since it introduces
+	/// 		and extra step (click) required by the user to access data.
+	/// 	</description>
 	/// 	<param name="val" type="boolean" default="undefined"> If defined, True enables the action menu, False disables it </param>
 	/// </function>
 	this.UseActionMenu = function(val)
@@ -19734,7 +19962,7 @@ Fit.Controls.WSDropDown = function(ctlId)
 
 		Fit.Internationalization.RemoveOnLocaleChanged(localize);
 
-		me = list = tree = actionMenu = search = forceNewSearch = hideLinesForFlatData = dataRequested = dataLoading = requestCount = onDataLoadedCallback = suppressTreeOnOpen = timeOut = currentRequest = classes = autoUpdatedSelections = useActionMenu = useActionMenuForced = translations = onRequestHandlers = onResponseHandlers = null;
+		me = list = tree = actionMenu = search = forceNewSearch = hideLinesForFlatData = dataRequested = dataLoading = nodesPopulated = requestCount = onDataLoadedCallback = suppressTreeOnOpen = timeOut = currentRequest = classes = autoUpdatedSelections = useActionMenu = useActionMenuForced = useActionMenuAfterLoad = treeViewEnabled = orgPlaceholder = customPlaceholderSet = translations = onRequestHandlers = onResponseHandlers = null;
 
 		base();
 	});
@@ -19861,6 +20089,7 @@ Fit.Controls.WSDropDown = function(ctlId)
 		if (dataRequested === false)
 		{
 			dataLoading = true;
+			nodesPopulated = false;
 
 			tree.Reload(true, function(sender)
 			{
@@ -19932,20 +20161,30 @@ Fit.Controls.WSDropDown = function(ctlId)
 			return;
 		}
 
-		var searchIcon = "<span class='FitUiControlDropDownActionMenuItem FitUiControlDropDownActionMenuItemSearch fa fa-search'></span> ";
-		var showAllIcon = "<span class='FitUiControlDropDownActionMenuItem FitUiControlDropDownActionMenuItemShowAll fa fa-sitemap'></span> ";
-		var delIcon = "<span class='FitUiControlDropDownActionMenuItem FitUiControlDropDownActionMenuItemDelete fa fa-times'></span> ";
+		var searchIcon = "<span class='FitUiControlDropDownActionMenuItemIcon FitUiControlDropDownActionMenuItemIconSearch fa fa-search'></span> ";
+		var showAllIcon = "<span class='FitUiControlDropDownActionMenuItemIcon FitUiControlDropDownActionMenuItemIconShowAll fa fa-sitemap'></span> ";
+		var delIcon = "<span class='FitUiControlDropDownActionMenuItemIcon FitUiControlDropDownActionMenuItemIconDelete fa fa-times'></span> ";
 
 		var selectedItems = me.GetSelections();
 		var addRemoveAll = selectedItems.length > 1;
 
 		actionMenu.RemoveItems();
 
-		actionMenu.AddItem(searchIcon + translations.SearchMore, "SearchMore");
+		if (me.InputEnabled() === true)
+		{
+			actionMenu.AddItem(searchIcon + translations.SearchMore, "SearchMore");
+		}
 
-		if (dataRequested === false || tree.GetChildren().length > 0)
+		if (treeViewEnabled === true)
 		{
-			actionMenu.AddItem(showAllIcon + translations.ShowAllOptions, "ShowAll");
+			if (nodesPopulated === false || tree.GetChildren().length > 0)
+			{
+				actionMenu.AddItem(showAllIcon + translations.ShowAllOptions, "ShowAll");
+			}
+			else //if (nodesPopulated === true && tree.GetChildren().length === 0)
+			{
+				actionMenu.AddItem(showAllIcon + "<i>" + translations.NoneAvailable + ": " + translations.ShowAllOptions + "</i>", "ShowAllNoneFound");
+			}
 		}
 
 		if (addRemoveAll === true)
@@ -19965,6 +20204,11 @@ Fit.Controls.WSDropDown = function(ctlId)
 		translations = locale.Translations;
 
 		updateActionMenu();
+
+		if (customPlaceholderSet === false)
+		{
+			orgPlaceholder(me.InputEnabled() === true ? translations.Search : "");
+		}
 	}
 
 	function onDataLoaded(cb)
@@ -20051,10 +20295,13 @@ Fit.Controls.WSDropDown = function(ctlId)
 			{
 				InvalidSelection		: "Invalid selection",
 
-				SearchMore				: "Search for more options",
-				ShowAllOptions			: "Show all available options",
+				// WSDropDown
+				Search					: "Search..",
+				SearchMore				: "Search for options",
+				ShowAllOptions			: "Show available options",
 				RemoveAll				: "Remove all selected",
-				Remove					: "Remove"
+				Remove					: "Remove",
+				NoneAvailable			: "The list is empty"
 			}
 		},
 		"da":
@@ -20063,10 +20310,13 @@ Fit.Controls.WSDropDown = function(ctlId)
 			{
 				InvalidSelection		: "Ugyldigt valg",
 
-				SearchMore				: "Søg efter flere valgmuligheder",
-				ShowAllOptions			: "Vis alle tilgængelige valgmuligheder",
+				// WSDropDown
+				Search					: "Søg..",
+				SearchMore				: "Søg efter valgmuligheder",
+				ShowAllOptions			: "Vis tilgængelige valgmuligheder",
 				RemoveAll				: "Fjern alle valgte",
-				Remove					: "Fjern"
+				Remove					: "Fjern",
+				NoneAvailable			: "Listen er tom"
 			}
 		},
 		"de":
@@ -20075,10 +20325,13 @@ Fit.Controls.WSDropDown = function(ctlId)
 			{
 				InvalidSelection		: "Ungültige Auswahl",
 
-				SearchMore				: "Nach weiteren Optionen suchen",
-				ShowAllOptions			: "Alle verfügbaren Optionen anzeigen",
+				// WSDropDown
+				Search					: "Suchen..",
+				SearchMore				: "Nach Optionen suchen",
+				ShowAllOptions			: "Verfügbare Optionen anzeigen",
 				RemoveAll				: "Alle ausgewählten entfernen",
-				Remove					: "Entfernen"
+				Remove					: "Entfernen",
+				NoneAvailable			: "Die Liste ist leer"
 			}
 		}
 	}