# search

O Objeto `search` retorna informações relacionadas a busca de produtos.

{% hint style="warning" %}
**Disponível para uso nas páginas:** search | catalog <mark style="color:red;">(limitada com apenas o atributo</mark> <mark style="color:red;"></mark><mark style="color:red;">**`order_options`**</mark> <mark style="color:red;"></mark><mark style="color:red;">disponível)</mark>
{% endhint %}

### Atributos disponíveis​ <a href="#atributos-disponiveis" id="atributos-disponiveis"></a>

<table><thead><tr><th width="203.9484654314315" align="center">Atributos</th><th>Característica</th></tr></thead><tbody><tr><td align="center"><code>{{ search.available_options }}</code></td><td>Retorna todas opções de disponibilidade de produto em um array.</td></tr><tr><td align="center"><code>{{ search.order_options }}</code></td><td>Retorna todas opções dos tipos de ordenação de produto em um array.</td></tr><tr><td align="center"><code>{{ search.word }}</code></td><td>Exibe o termo buscado na loja na pesquisa atual.</td></tr><tr><td align="center"><code>{{ search.brands }}</code></td><td>Retorna todas as marcas vinculadas aos produtos da busca atual em um array, para cada opção é possível exibir os atributos disponibilizados para marcas.</td></tr></tbody></table>

## Como Usar

No código HTML o objeto `search` pode ser usado para exibir opções de classificação dos produtos em uma página.

### Para exibir uma Consulta por Disponibilidade

No código abaixo é realizada a validação do objeto `search` e caso haja o atributo `available_options` é executado um loop para exibir o nome de cada opção de disponibilidade de produtos existente.

{% code title="Input" %}

```html
{% if search.available_options %}
  <h3> Exibir Por:</h3>
  <select name="disponibilidade_tag">
    {% for option in search.available_options %}
    <option value="{{ option.value }}">{{ option.name }}</option>
    {% endfor %}
  </select>
{% endif %}  
```

{% endcode %}

{% code title="Output" %}

```html
<h3> Exibir Por:</h3>
<select name="disponibilidade_tag">
  <option value="1">Disponível</option>
  <option value="2">Indisponível</option>
  <option value="3">Sob Consulta</option>
</select>
```

{% endcode %}

### Para exibir uma Consulta por Ordenação

No código abaixo é realizada a validação do objeto `search` e caso haja o atributo `order_options` é executado um loop para exibir o nome de cada opção por características de ordenação dos produtos existente.

{% code title="Input" %}

```html
{% if search.order_options %}
  <h3>Classificar Por:</h3>
  <select name="order">
    {% for option in search.order_options %}
    <option value="{{ option.value }}">{{ option.name }}</option>
    {% endfor %}
  </select>
{% endif %}  
```

{% endcode %}

{% code title="Output" %}

```html
<h3>Classificar Por:</h3>
<select name="order">
  <option value="4">Relevância</option>
  <option value="7">Nome do Produto</option>
  <option value="1">Menor Preço</option>
  <option value="2">Maior Preço</option>
  <option value="3">Mais Vendido</option>
</select>
```

{% endcode %}

### Para exibir a Palavra Buscada

No código abaixo é realizada a validação do objeto `search` e caso haja o atributo `word` é exibida a palavra pesquisada.

{% code title="Input" %}

```html
{% if search.word %}
  <h5>Resultados para a busca: <strong> {{ search.word }}</strong></h5>
{% endif %}  
```

{% endcode %}

{% code title="Output" %}

```html
<h5>
    Resultados para a busca: <strong>Camiseta</strong>
</h5>
```

{% endcode %}

### Para exibir as Marcas Relacionadas a busca

No código abaixo é realizada a validação do objeto `search` e caso haja o atributo `brands` é executado um loop para exibir o nome de cada marca dos produtos existente.

{% code title="Input" %}

```html
{% if search.brands %}
  <h4>Filtrar por Marcas:</h4>
  <select name="filtrar_marca">
    {% for brand in search.brands %}
    <option value="{{ brand.name }}">{{ brand.name }}</option>
    {% endfor %}
  </select>
{% endif %}  
```

{% endcode %}

{% code title="Output" %}

```html
<h4>Filtrar por Marcas:</h4>
<select name="filtrar_marca">
  <option value="Marca A">Marca A</option>
  <option value="Marca B">Marca B</option>
  <option value="Marca C">Marca C</option>
  <option value="Marca D">Marca D</option>
  <option value="Marca E">Marca E</option>
</select>
```

{% endcode %}
