Developers
Authorization
API Resources
NL Interpreter
Search
Benti
Search Box
Overview
This component will be a form with the query parameter.
You can link the search box to the results component. This will update the results component when the search box form is submitted.
Usage
How to create this component:
var searchBox = sdk.component('searchBox', target:String, options:Object);Sample
By default, this component looks like this:
Target
This is the HTML component. For example, the "#inbenta" target is:
<div id="inbenta"></div>Options
Available options to set in this component
| Name | Type | Default | Description | Example |
|---|---|---|---|---|
| autofocus | Boolean | false |
Determines whether to automatically focus on the input when rendered. | var searchBox = sdk.component('searchBox', '#search-box', {autofocus: true}); |
| title | String | '' | Allows to add a message of your choice above the search box. | var searchBox = sdk.component('searchBox', '#search-box', {title: 'Enter your question'}); |
Default options object
{
autofocus: false,
title: ''
}Methods
This component does not have any methods.
Subcomponent
This component does not have any subcomponents.
Events
Events to listen on this component.
| Name | Description |
|---|---|
| query | Sent whether the query has changed |
Tracking
This component does not track any event.
Labels
Labels of this component. The default labels of each component can be rewritten in the SDK creation configuration.
| Name | Default | Description |
|---|---|---|
| SEARCH_BOX_BUTTON | Send |
HTML for send query |
| SEARCH_BOX_PLACEHOLDER | Question |
Text for search box placeholder |
Examples
Create Searchbox with a typeahead autocomplete linked to it.
var searchBox = sdk.component('searchBox', '#searchbox', {});
var autocompleter = sdk.component('autocompleter', '#autocompleter', {});
autocompleter.linkToSearchBox(searchBox);