mad-select-field
Select estático com options fixas.
Componente select estatico para opcoes fixas (enum, listas pequenas, valores hardcoded). Para opcoes vindas do banco, usar <mad-dbcombo-field>.
Props
| Prop | Tipo | Default | Descricao |
|---|---|---|---|
| name | string | '' | Nome do campo (obrigatorio) |
| label | string | '' | Label do campo |
| items | array | [] | Opcoes no formato [valor => label, ...] |
| selected | string | null | Valor pre-selecionado (auto via MadRenderContext se omitido) |
| value | string | '' | Alias de selected — usado quando selected vem vazio |
| placeholder | string | '' | Texto da opcao vazia (so aparece se informado) |
| hint | string | '' | Texto de ajuda |
| error | string | '' | Mensagem de erro |
| required | bool | false | Campo obrigatorio |
| disabled | bool | false | Campo desabilitado |
| attrs | string | '' | Atributos HTML extras |
| width | string | '' | Largura CSS (inline style) |
| max-width | string | '' | Largura máxima CSS (inline style) |
| no-results-create-action | string | '' | Classe::metodo — abre form no dropdown quando nao ha resultados |
| no-results-create-label | string | 'Cadastrar novo' | |
| no-results-create-icon | string | 'plus' | |
| no-results-create-class | string | 'mad-btn mad-btn-primary mad-btn-sm' | |
| no-results-quick-register-action | string | '' | Classe::metodoEstatico — cadastro inline |
| no-results-quick-register-label | string | 'Adicionar' | |
| no-results-quick-register-icon | string | 'check' | |
| no-results-quick-register-class | string | 'mad-btn mad-btn-success mad-btn-sm' | |
| no-results-message | string | '' | Mensagem do bloco no-results |
Detalhes sobre no-results-*: ver dbcombo-rules.md (mesma API em todos os selects MAD que usam o widget MAD Select).
Uso basico (array de opcoes)
@php
$tipos = ['A' => 'Ativo', 'I' => 'Inativo', 'P' => 'Pendente'];
@endphp
<mad-select-field name="status" label="Status" :items="$tipos" />
Com placeholder
<mad-select-field name="status" label="Status"
:items="['A' => 'Ativo', 'I' => 'Inativo']"
placeholder="Selecione..." />
Required
<mad-select-field name="prioridade" label="Prioridade"
:items="['baixa' => 'Baixa', 'media' => 'Media', 'alta' => 'Alta']"
required />
Com valor pre-selecionado
<mad-select-field name="tipo" label="Tipo"
:items="['F' => 'Fisica', 'J' => 'Juridica']"
selected="J" />
Quando dentro de <mad-form> com $form->fill($record) ou $form->set('tipo', 'J'), o selected e resolvido automaticamente via MadRenderContext — nao precisa passar.
Se items vier vazio no Blade, o componente tenta $form->items['<name>'] como fallback — util quando onEdit()/mount() popula as opcoes via $this->form->setItems('tipo', [...]) antes do primeiro render.
Precedencia do valor selecionado
A ordem que o blade aplica (\Mad\Support\MadFieldValue::resolve()):
- Valor do registro/contexto (
$form->fill($record),$form->set()) — vence selectedna tag; se vazio, o aliasvalue- Variavel do mesmo nome disponivel na view (
$$name)
Ou seja: um literal na tag nao sobrescreve o valor vindo do banco — use
selected/value apenas como default de tela nova.
Hidden e readonly em runtime
O componente le o estado do MadRenderContext: $form->hide('status') adiciona
a classe mad-hidden no wrapper e $form->readonly('status') adiciona
mad-readonly + mad-readonly-select no <select>. Nao existem props
hidden/readonly na tag — o controle e server-side pelo MadForm.
Evento change (chamada ao backend)
<mad-select-field name="tipo" label="Tipo"
:items="['F' => 'Fisica', 'J' => 'Juridica']"
mad:change="onTipoChange" />
public function onTipoChange(string $value): void
{
if ($value === 'J') {
$this->form->set('label_doc', 'CNPJ');
} else {
$this->form->set('label_doc', 'CPF');
}
}
Dentro de formulario
<mad-form submit="onSave">
<mad-form-grid :cols="2">
<mad-input-field name="nome" label="Nome" required />
<mad-select-field name="status" label="Status"
:items="['A' => 'Ativo', 'I' => 'Inativo']" required />
</mad-form-grid>
<mad-btn type="submit" variant="primary" icon="save">Salvar</mad-btn>
</mad-form>
Quando usar select-field vs dbcombo-field
| Cenario | Usar |
|---|---|
| Opcoes fixas (enum, status, sim/nao) | <mad-select-field> |
| Lista hardcoded curta (<10 itens) | <mad-select-field> |
| Opcoes vindas do banco (model Eloquent) | <mad-dbcombo-field> |
| Lista grande com busca | <mad-dbcombo-field> ou <mad-dbseek-field> |
| Cascata entre selects (depends-on) | <mad-dbcombo-field> |
NUNCA fazer
{{-- ERRADO: gerar options manualmente quando dbcombo resolve --}}
@php
$tipos = TipoProduto::pluck('descricao', 'id')->all();
@endphp
<mad-select-field name="tipo_id" label="Tipo" :items="$tipos" />
{{-- CERTO: dbcombo carrega do banco automaticamente --}}
<mad-dbcombo-field name="tipo_id" label="Tipo" model="TipoProduto" display="descricao" />
{{-- ERRADO: select nativo --}}
<select name="status">
<option value="A">Ativo</option>
<option value="I">Inativo</option>
</select>
{{-- CERTO --}}
<mad-select-field name="status" label="Status" :items="['A' => 'Ativo', 'I' => 'Inativo']" />
{{-- ERRADO: montar o <select> via JS depois do render --}}
<select id="status"></select>
<script>document.querySelector('#status').innerHTML = '<option value="A">Ativo</option>';</script>
{{-- CERTO --}}
<mad-select-field name="status" label="Status" :items="['A' => 'Ativo']" />