Skip to content

Checkboxes

tanthammar edited this page Nov 18, 2020 · 12 revisions

Checkboxes

Extends BaseField

Additional methods

->options($options)

  • A list or flat key => value based Array, Collection or Closure.
  • @param array|\Closure|\Illuminate\Support\Collection $options
  • OBSERVE: if you use a callable, it will be executed on EVERY re-render of the component! Maybe you should consider setting the $options in mount() instead?
  • You can use a component method that returns an array; ->options($this->someMethod())

Examples

/**
 * Checkboxes, associative array
 */
$options = ['Wifi' => 'wf', 'Bluetooth' => 'bl', 'Ethernet' => 'eth'];
Checkboxes::make('Checkboxes')
    ->options($options)
    ->rules(['array', Rule::in(array_values($options))])
    ->default(['wf']);
/**
 * Checkboxes where labels = key
 */
$options = ['Wifi', 'Bluetooth', 'Ethernet'];
Checkboxes::make('Checkboxes')
    ->options($options)
    ->rules(['array', Rule::in($options)])
    ->default(['Wifi']);

Optional: wire:model.defer

When a user selects/clicks multiple checkboxes, fast, they won't all be selected if the network request is slow. To get around it you can set ->wire('wire:model.defer').

  • You will loose realtime validation but the field will be validated when the form is submitted.
Checkboxes::make('Checkboxes')->wire('wire:model.defer');

Blade component

@foreach($field->options as $value => $label)
        <x-tall-checkboxes
            :field="$field"
            :value="$value"
            :label="$label"
            :options-idx="$field->name.$loop->index" />
@endforeach

Styling

Extend Blade component (or override in config file)

Tanthammar\TallForms\Components\Checkboxes::class

Theme, css classes are the same as Checkbox.

Clone this wiki locally