Lewp module "miyu"

Description

A simple search form that provides the registration of callbacks when the search field changes. In addition to that, it is possible to change the listener event and undo to the previous state.

Installation

In the terminal, go either to the global module or site module level of your hierarchy. Then invoke the following command.

git clone git@gitlab.com:lewp/modules-search-miyu.git modules/search/miyu

Dependencies

The module depends on MoViS, which can be found here. Clone this repository into your global or site level lib/js folder:

git clone git@gitlab.com:emirror-de/movis.git lib/js/movis

Configuration

In your page file, add the following command to add the module to your page.

$this->addModule(
    "search_miyu",
    [
        "button_content_node" => $this->createTextNode('Submit'),
        "searchinput_placeholder" => 'Input your search term'
    ]
);

Available parameters

Key	Default value	Example value	Description
button_content_node	$this->createTextNode('Submit')		Can be any DOMNode that you want to use.
searchinput_placeholder		"Enter your search..."	The value of the placeholder property of the input field.

Javascript API

The following JavaScript functions are available. By default, all registered listeners are triggered on the keyup event of the input element.

Member name	Parameter	Description
addStateListener	callback	You can register a callback function that is triggered on the event that is registered on the input element.
removeStateListener	callback	Provides the ability to remove a function that has previously been added.
getState		Returns the current value of the input element.
undoState		Restores the last value of the input element and triggers all registered state listener functions.
changeEventListener	newEvent	Provides the ability to use another event than "keyup" to trigger the listener functions.