Class SuggestBox

Object
   |
   +--MoreMotionObject
         |
         +--ProcessField
               |
               +--SuggestBox

class SuggestBox

extends ProcessField

Represents Process Field SuggestBox. SuggestBox is a highly customizable and powerful MoreMotion Object that suggests options to the user as he types in characters into the input field. After the predefined idle time is expired, this class prepares an AjaxRequest to retrieve the data from the MoreMotion Ajax Service to suggest to the user. A Drop-down box is built to display the options received.

During the form submit, SuggestBox appends two parameters to the request; one for the entered text and one for the value associated with the entered or selected text. Depending on the specified properties, this class ensures that the user selects an existing option or types in a non-existing value.

Handlers:
SuggestBox event handler functions that are registered for the SuggestBox events must have one parameter which is the SuggestBox object.

function MyOnBeforeRowPaintHandler(sbox) {
  if (sbox.getFieldValue("DISABLED") == "false") {
    ...
  }
}
Defined in SuggestBox.js

Field Detail

elm

HTMLElement elm

The handle to the TEXT INPUT element that is visible and editable.

props

Object props

SuggestBox Properties Object.



actionName	The name of the Ajax actionParams configuration element
dataSource	The name of the data source that will provide the options to suggest
valueFieldName	The name the HIDDEN INPUT field that will keep the value associated with the selected option.
autoComplete	AutoComplete Flag. true means as the user navigates on the options on the DropDownBox the value of focused options will be transfered to the TEXT INPUT field.
delay	The time (in miliseconds) to elapse after the last time the user pressed a key.
align	The horizontal alignment of the DropDownBox relative to the TEXT INPUT field The values are "left" (the default), "right" and "center"
width	The width of the DropDownBox in pixels
suggestField	The name of the field in the response whose value will be assigned as the option text (the suggested value) of this SuggestBox
valueField	The name of the field in the response whose value will be assigned as the value of this SuggestBox
waitForResponse	Flag to wait for the Ajax Response once it is sent to the Ajax Service. (Not Recommended)
boxStyle	The CSS Styles for the DropDownBox area.
hdrStyle	The CSS Styles for the rows header.
hdrCaptions	The header captions (separated with commas)
hdrStyles	The CSS Styles for header columns. They should be separated with "|" characters.
rowStyle	The CSS Styles for the DropDownBox Rows. The styles for the focussed rows can be given after a "/" character. e.g. rowStyle="background-color:silver/white; color:navy/black".
colFields	The Result set field names (separated with commas) for the Row Columns.
colWidths	The Widths in percent (separated with commas) of the Row Columns.
colAligns	The Alignments (separated with commas) of the Row Columns. The values can be "left", "right", "center"
colStyles	The CSS Styles for Row Columns. They should be separated with "|" characters.
sbarStyle	The CSS Styles for the Status Bar. The styles for the last page can be given after a "/" character. e.g. rowStyle="background-color:#silver/pink;
onFocusHandler	The name of the onFocus Handler Function.
onBeforeSendRequestHandler	The name of the onBeforeSendRequest Handler Function
onReceiveResponseHandler	The name of the onReceiveResponse Handler Function
onBeforeRowPaint	The name of the onBeforeRowPaint Handler Function
onFocusOptionHandler	The name of the onFocusOption Handler Function
onChangeHandler	The name of the onChange Handler Function
onBlurHandler	The name of the onBlur Handler Function
required	The property that specifies what type of input is required for this SuggestBox. The options are: No input is required The TEXT INPUT must have a value The both TEXT INPUT field and HIDDEN INPUT fields must have a value . This means The typed or selected option must have an associated value in the system. If TEXT INPUT field has a value then the HIDDEN INPUT must also have a value . The HIDDEN INPUT must not have a value . This means typed value must be new and therefore
valErrorHandler	The name of the Validation Error Handler Function
valHandler	The name of the Validation Handler Function
pageInfo	Page Information as String. See PageInfo. This property should be supplied only if the SuggestBox resides in a DOM content that was fetched with a MoreMotionAjaxManager.refreshAreas() method call. It is required to access the configuration of the origin page.

Note:   For all the style properties, instead of CSS style strings, CSS class names, that are prefixed with a period ("."), can be specified. The both of the following definitions are valid.
rowStyle="background-color:#f1f1f1/white; font:Arial; color:navy/black"
rowStyle=".row/.rowhl"

selm

HTMLElement selm

The handle to the HIDDEN INPUT element that will keep the value associated with the selected option.

SuggestBox

SuggestBox(node)

appendRequestParams

void appendRequestParams(acc,prefix)

Appends the request parameters and their values to the given request parameter accumulator.

This method is called prior to the submit of the request either with Ajax or with regular Http. Depending on the type of the process field one or more request parameters can be appended to the parameter accumulator.

Parameters:
acc - The RequestParameterAccumulator object
prefix - The prefix to be put in front of the parameter name(s)

cancelRequest

void cancelRequest()

Cancels all the previous requests that are in response pending status. Please note that this method cannot cancel the requests that were sent with waitForResponse option.

changeSkin

void changeSkin(newSkin)

clear

void clear()

Clears the values of both TEXT INPUT and HIDDEN INPUT fields.

cloneParams

void cloneParams(params1,params2)

closeDropDownBox

void closeDropDownBox()

Closes the DropDownBox if it is open

focus

void focus()

getFieldValue

String getFieldValue(fieldName, index)

Returns the value of the field from specified row.

Parameters:
fieldName - The name of the field
index - Row Index (If omitted current row is used)

Returns:
The value of the field

getProcessFieldNames

Object getProcessFieldNames(seperator)

getSymbolValue

Syting getSymbolValue(symbol)

Returns the value of the given symbol from the symbol pool

Returns:
The value of the symbol

getValue

String getValue()

Returns the associated value and the value delimited with ";". Example: var v = sbox.getValue(); // "1;Notebooks"

isDropDownBoxOpen

Boolean isDropDownBoxOpen()

Returns true is drop down box is curently open, false otherwise.

replaceSymbols

String replaceSymbols(s)

This method is meant to be used during building the rows of the DropDownBox or while navigating over the options of the DropDownBox. It replaces the $() symbols in the given string with either the symbol values from symbol pool or the values of the row columns.

Parameters:
s - The string that contains $() symbols.

Returns:
The resolved string

setSymbolValue

void setSymbolValue(symbol, value)

Sets the value of a pool symbol. If the symbol does not exist in the pool it is created. This function is typically used in a onBeforeRowPaint event handler defined in props.onBeforeRowPaint property to manipulate the content of the DropDownBox row being painted.

Parameters:
symbol - The name of the symbol
value - The value of the symbol

setValue

void setValue(value)

Sets the value of this SuggestBox.

Parameters:
value - A string that contains both associated value and the value separated with ";". Example: sbox.setValue("1;Notebooks");

validate

Boolean validate()

Validates this SuggestBox field and returns true if validation is successful, false otherwise.