cfw/suggest.md

+![ceicom](http://www.ceicom.com.br/img/logo.png?v=1.0)
+
+## Descrição
+
+> Informações relacionadas ao sistema Magic Suggestion da Ceicom, utilizado para mostrar conteúdos baseados em requisições ajax/opções estaticas ou implementação de tags.
+
+> Tem um funcionamento semelhante ao chosen2 mais conhecido como "multiselect".
+
+> Utiliza de base o plugin [**magic suggest**](https://github.com/Magicsuggest/magicsuggest) com algumas modificações no core para funcionar dentro do cfw de forma "dinamica"
+
+## Requisitos.
+> Sistema somente disponivel para funcionamento dentro das paginas de detalhamento de dados do CMS.
+
+## Estrutura
+O input é gerado apartir de uma div, esta div deve conter a classe **suggest** e um nome para o input. *(ver **data-name**)*
+```html
+<div class="suggest" data-name="keywords"></div>
+```
+
+## Parâmetros.
+### **data-name**
+Nome do input que será gerado, é o único parametro obrigatório (além da classe **suggest**) para funcionamento do plugin.
+```html
+<div class="suggest" data-name="keywords"></div>
+```
+### **data-showtrigger**
+Deve tratar o input como um **select** adicionado o *trigger* ao final do input.
+```html
+<div class="suggest" data-name="keywords" data-showtrigger="true"></div>
+```
+> **Obs.** afeta a regra de caracteres mínimos do input.
+
+### **data-ajax**
+Informa ao input que suas opções são dinâmicas.
+A requisição será feita para: ```/admin/modulos/handlers/selects.ashx``` passando 2 parâmetros:
+1. **type**: com o valor ```suggest```
+2. **select**: com o valor igual ao ```data-name``` que foi informado
+```html
+<div class="suggest" data-name="keywords" data-ajax="true"></div>
+```
+> **Obs.** a aplicação desta opção faz com o que o plugin **IGNORE TOTALMENTE** a opção **data-options** (se repassada).
+
+### **data-options**
+Informa ao input suas opções iniciais.
+Os dados devem ser recebidos em *string* separados por vírgula.
+```html
+<div class="suggest" data-name="keywords" data-options="opção1,opção2,opção3"></div>
+```
+> **Obs.** esta opção é **TOTALMENTE IGNORADA** se a opção **data-ajax** existir.
+
+### **data-input**
+Libera o usuário para digitas suas próprias opções fora das pré definidas (ajax ou estaticas).
+```html
+<div class="suggest" data-name="keywords" data-input="true"></div>
+```
+> **Obs.** esta opção é automaticamente **habilitada** se não existirem as opções **data-ajax** ou **data-options**.
+
+### **data-value**
+Quais valores devem vir inicialmente selecionados.
+Para opções **dinâmicas** informe os **ID´s** separados por vírgula.
+Nos demais casos informe o **nome/valor**.
+```html
+<!-- dados dinâmicos -->
+<div class="suggest" data-name="keywords" data-ajax="true" data-value="1,2"></div>
+<!-- dados estáticos -->
+<div class="suggest" data-name="keywords2" data-options="opção1,opção2,opção3" data-value="opção1,opção2"></div>
+<!-- ou -->
+<div class="suggest" data-name="keywords3" data-value="item1,item2"></div>
+```
+
+## Regra caracteres mínimos
+Quando input for configurado para requisições ajax exigirá no mínimo **2 caracteres** para efetuar a consulta.
+Esta regra perde a validade quando é solicitado ao input se portar como **select**, neste caso não existe caracteres mínimos para a consulta.
+
+## Estrutura de dados
+### Envio de dados (salvar/atualizar)
+Os dados serão submitados junto ao formulário padrão, os itens selecionados serão enviados em estilo array de inputs:
+```html
+<div class="suggest" data-name="keywords1" data-ajax="true"></div>
+<div class="suggest" data-name="keywords2" data-options="item1,item2,item3"></div>
+<div class="suggest" data-name="keywords3"></div>
+```
+```
+...
+keywords1[]: 0
+keywords1[]: 1
+keywords2[]: item1
+keywords3[]: francisco beltrão
+keywords3[]: paraná
+```
+
+### Recebimento de dados (handler select)
+Os dados devem ser enviados em um array de objetos contendo as chaves **id** e **name**:
+```json
+[
+  {
+    "id": 0,
+    "name": "Paris"
+  },
+  {
+    "id": 1,
+    "name": "New York"
+  },
+  {
+    "id": 2,
+    "name": "Francisco Beltrão"
+  }
+]
+```
+
+**Obrigado 👍**
\ No newline at end of file