sekFormTools.input.autocomplete

Last updated Dec 9th, 2019 | Page history | Improve this page | Report an issue

Support the team building MODX with a monthly donation.

The budget raised through OpenCollective is transparent, including payouts, and any contributor can apply to be paid for their work on MODX.

Backers

Budget

$301 per month—let's make that $500!

Learn more

What is input.autocomplete?¶

Add an auto-complete field to a form quickly and easily using this snippet.

Usage¶

Example for input.autocomplete using an object:

[[input.autocomplete? &object=`{"name": "sekftUSCities", "sortby": "city_name", "value": "city_name", "label": "city_name"}`]]

Properties¶

Name	Description	Default	Required	Version
`input_id`	The id to assign to the input box.			>0.0.1
`name`	The name to assign to the input box.			>0.0.1
`value`	The value to assign to the input box.			>0.0.1
`object`	JSON array of options to return a combobox list.		Yes	>0.0.1
`filter`	JSON array to filter the combo list.			>0.0.1
`helper_snippet`	Name of the snippet to call by ajax request to change option list.			>0.0.1
`min_length`	Minimum number of characters typed before executing filter.	2		>0.0.1
`max_rows`	Maximum number of rows to return and display in the list	15		>0.0.1

object¶

The object property has several parts to quickly define combo box options from a modx table.

Name	Description	Required	Version
name	The name of the modx table called by the object name.	Yes	>0.0.1
sortby	The table field to sort by.		>0.0.1
value	The table field that will be used as the value for the option.	Yes	>0.0.1
label	The table field that will be used as the label for the option.	Yes	>0.0.1

filter¶

The filter property has several parts to filter the data returned by the object property.

Name	Description	Required	Version
input_id	The id of an input field that will dynamically change the options list.		>0.0.1
name	The object name to base filter on.		>0.0.1
field	The field that will be used to filter the results.	Yes	>0.0.1
value	The value to filter on.		>0.0.1

Examples¶

Some additional examples

Object¶

Grabbing data by a table object is simple and straight forward. Using a json string, enter the name of the object, the optional sort by, and the table fields to use in the auto-complete label and value.

[[!input.autocomplete?
    &object=`{"name": "sekftUSCities", "sortby": "city_name", "value": "city_name", "label": "city_name"}`
]]

The auto-complete can also be filtered live using jquery. please view the Advanced Examples for more information.