Docs›Componentes (Admin)›mad-select-field
Componentes (Admin)

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()):

  1. Valor do registro/contexto ($form->fill($record), $form->set()) — vence
  2. selected na tag; se vazio, o alias value
  3. 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']" />