Missouri State University Pattern Library

Input: Search

There are no notes for this item.

<div class="form-control Page1">
    <label for="field-1">Search</label>
    <div class="description" id="description-1">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Id eum ipsam consequuntur excepturi mollitia cupiditate, exercitationem sequi. Aperiam, id consequatur?</div>
    <input id="field-1" type="search" name="Field_search_input" aria-describedby="description-1" />

</div>
 
{{#> @control-wrapper}}
  {{#*inline 'container'}}
      {{#if label}}
        {{> @label}}
      {{/if}}
      {{#if description}}
        {{> @description}}
      {{/if}}

      <input id="field-{{pageId}}" type="{{#if type}}{{type}}{{else}}text{{/if}}" name="Field_{{name}}" {{#if size}} size="{{size}}" {{/if}} {{#if maxLength}} maxlength="{{maxLength}}" {{/if}} {{#if required}} required aria-required="true" {{/if}} {{#if disabled}} disabled {{/if}}{{#if value}} value="{{value}}"{{/if}}{{#if description}} aria-describedby="description-{{pageId}}"{{/if}} />
  {{/inline}}
{{/@control-wrapper}}
 
{
  "pageId": 1,
  "label": "Search",
  "description": "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Id eum ipsam consequuntur excepturi mollitia cupiditate, exercitationem sequi. Aperiam, id consequatur?",
  "type": "search",
  "name": "search_input",
  "maxLength": null,
  "size": null,
  "required": null,
  "disabled": null,
  "ariaLabel": "Search"
}