AJAX
ss:ajax:delayedload ss:ajax:event ss:ajax:region
Data
ss:data:calendar ss:data:column ss:data:postrepeater ss:data:productbrandrepeater ss:data:productcategoryrepeater ss:data:productrepeater ss:data:repeater ss:data:table ss:data:template ss:data:tree
Forms
ss:forms:address ss:forms:captcha ss:forms:checkbox ss:forms:checkboxgroup ss:forms:codeeditor ss:forms:combobox ss:forms:datepicker ss:forms:dialogbox ss:forms:editbox ss:forms:fileupload ss:forms:form ss:forms:hidden ss:forms:money ss:forms:officeuseregion ss:forms:option ss:forms:password ss:forms:paymentmethod ss:forms:radiobutton ss:forms:radiobuttongroup ss:forms:row ss:forms:searchbox ss:forms:signature ss:forms:slider ss:forms:spinbox ss:forms:submitbutton ss:forms:submitimage ss:forms:submitlink ss:forms:successcontent ss:forms:textarea ss:forms:timepicker
Layout
ss:layout:gallery ss:layout:productgallery ss:layout:rotator ss:layout:stepper ss:layout:stepperpanel ss:layout:tablist ss:layout:tablistitem
Logic
ss:logic:dependency ss:logic:parse ss:logic:if ss:logic:else ss:logic:include ss:logic:variable
Navigation
ss:navigation:breadcrumbs ss:navigation:item ss:navigation:primary ss:navigation:secondary
Standard
ss:standard:audio ss:standard:embed ss:standard:icon ss:standard:image ss:standard:link ss:standard:script ss:standard:tooltip ss:standard:video
Templates
ss:templates:button ss:templates:card ss:templates:column ss:templates:fancybox ss:templates:faq ss:templates:flexlayout ss:templates:header ss:templates:row ss:templates:section ss:templates:teammember ss:templates:testimonial
Regions
ss:regions:content ss:regions:contentadditional ss:regions:security ss:regions:togglable
Third Party
ss:thirdparty:googlemap ss:thirdparty:googlemapmarker
Attributes
Examples

<ss:forms:combobox> </...>

Allows the user to select from a range of options.

Content

The options that will appear in the ComboBox, after any options populated from the datasource.

Attributes

as
string
The name of the variable to be registered for each option. For example, as="myvar" will let you reference $myvar inside the control.
dataColumn
Sets the data column

The datacolumn links the form item to a key used when getting or saving from a component (as defined by the parent form).
disabled
bool
Disable Input

Disables the input, preventing user interaction
focusOnLoad
bool
Focus On Load

If true, this control will attempt to focus itself after the page has loaded. Note that only one element may be focused on the page at a time.
Default = false
height
string
Height

Sets the height of the element. The default units are pixels. include the percentage symbol % to user percentage values.
id
string
Most form items need a unique id so that they can submit data to the server. No two form items may have the same id. For situations where multiple form items submit to the same field, see the name attribute. Id's that begin with contact_ will automatically save Contact information to the Contact database as long as the user has entered enough identifying information (ideally Name and Email). Check the Contact Fields page for correct field names.
keyAs
string
The name of the variable to be registered for each option's key.
For arrays of entities from the database (for example getAll()), the keys will be incrementing integers starting at 0.
name
string
Sets the name of the form item. Most of the time, the id attribute will suffice. However with form items that post multiple values into an array, each item will need to have the same name, followed by []. For example three controls with name="data[]", will all post into 'data'.
Radio buttons belonging to the same group will have to share the same name.
saveState
bool
Restore state on reload

Whether or not the value of the input is persists when the page is revisited.
Default = false
showValueOption
bool
If the value not a contact of the datasource or in the list of options, should it be allowed
transformations
Value Transformations

Sets the value transformations to be applied to the value of the form item as a comma separated string.
validations
Validations

Sets the validations to be applied to the value of the form item as a comma separated string.

Eg: validations="mandatory"
width
string
Width

Sets the width of the element. The default units are pixels. include the percentage symbol % to user percentage values.

Examples

Specify Default Option

Demonstrates the tablist defaultly selecting an option.

HTML:


Run Example

Specify Default Option via Query String

Demonstrates the selection of an option specified through the query string.

HTML:

Populate From Data Source

Demonstrates the populating the combobox options from a datasource.

HTML:


Run Example

Add To Data Source

Building on the previous example, adds an empty option to prompt the user to make a selection, and a second option not included by the data source.

HTML:


Run Example

Populate from Custom Field

Fill the values of a Combobox from a Custom Field

HTML:

Products Filtering

Products filtered by category and brand comboboxes.

HTML: