fit-ui 2.5.1 → 2.5.2

package/dist/Fit.UI.js

@@ -648,7 +648,7 @@ Fit._internal =
 {
 	Core:
 	{
-		VersionInfo: { Major: 2, Minor: 5, Patch: 1 } // 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: 2 } // 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;
 
-		txtActive.value = "";
+		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.
 
-		Fit.Dom.Data(txtActive.parentElement, "editing", val !== "" ? "true" : null);
-		Fit.Dom.Data(txtActive, "editing", val !== "" ? "true" : null);
-		me._internal.Repaint();
+			// Clear active input field in case it has a value
+			txtActive.value = "";
+			setInputEditing(txtActive, false);
 
-		var txt = ((focusAssigned === true) ? txtActive : txtPrimary);
+			txt = txtPrimary;
+			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,25 +17446,44 @@ 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);
 		}
 	}
 
@@ -17492,9 +17523,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 +17603,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 +17734,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 +17808,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 +17925,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 +17972,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 +18524,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 +19168,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 +19178,7 @@ 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 translations = null;
 
 	var onRequestHandlers = [];
@@ -19218,22 +19295,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 +19315,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
@@ -19333,11 +19418,16 @@ Fit.Controls.WSDropDown = function(ctlId)
 		{
 			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,12 +19520,22 @@ 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.
+			var onlyShowAllOptionDisplayedInActionMenu = actionMenu.GetItems().length === 1 && actionMenu.HasItem("ShowAll") === true;
+
+			if (useActionMenu === true && onlyShowAllOptionDisplayedInActionMenu === false)
 			{
 				me.SetPicker(actionMenu);
 			}
 			else
 			{
+				if (onlyShowAllOptionDisplayedInActionMenu === true)
+				{
+					useActionMenuAfterLoad = false;
+				}
+
 				me.SetPicker(tree);
 				ensureTreeViewData();
 			}
@@ -19506,6 +19606,7 @@ Fit.Controls.WSDropDown = function(ctlId)
 		}
 
 		dataLoading = true;
+		nodesPopulated = false;
 
 		var ensure = function()
 		{
@@ -19651,10 +19752,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 +19764,19 @@ 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);
+			updateActionMenu(); // Update action menu to have SearchMore action added/removed depending on whether input is allowed or not
+		}
+
+		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>
@@ -19734,7 +19844,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 = translations = onRequestHandlers = onResponseHandlers = null;
 
 		base();
 	});
@@ -19861,6 +19971,7 @@ Fit.Controls.WSDropDown = function(ctlId)
 		if (dataRequested === false)
 		{
 			dataLoading = true;
+			nodesPopulated = false;
 
 			tree.Reload(true, function(sender)
 			{
@@ -19941,12 +20052,19 @@ Fit.Controls.WSDropDown = function(ctlId)
 
 		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 (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)
 		{
@@ -20054,7 +20172,8 @@ Fit.Controls.WSDropDown = function(ctlId)
 				SearchMore				: "Search for more options",
 				ShowAllOptions			: "Show all available options",
 				RemoveAll				: "Remove all selected",
-				Remove					: "Remove"
+				Remove					: "Remove",
+				NoneAvailable			: "None available"
 			}
 		},
 		"da":
@@ -20066,7 +20185,8 @@ Fit.Controls.WSDropDown = function(ctlId)
 				SearchMore				: "Søg efter flere valgmuligheder",
 				ShowAllOptions			: "Vis alle tilgængelige valgmuligheder",
 				RemoveAll				: "Fjern alle valgte",
-				Remove					: "Fjern"
+				Remove					: "Fjern",
+				NoneAvailable			: "Ingen tilgængelige"
 			}
 		},
 		"de":
@@ -20078,7 +20198,8 @@ Fit.Controls.WSDropDown = function(ctlId)
 				SearchMore				: "Nach weiteren Optionen suchen",
 				ShowAllOptions			: "Alle verfügbaren Optionen anzeigen",
 				RemoveAll				: "Alle ausgewählten entfernen",
-				Remove					: "Entfernen"
+				Remove					: "Entfernen",
+				NoneAvailable			: "Keine verfügbar"
 			}
 		}
 	}