Flux native select value can't be set to 0

[gustavosobrinho01]

Flux version

v1.0.29

Livewire version

v3.5.16

What is the problem?

When using the select as shown in the code and images below, the screen loads with the value 0. When I select the “Ativos” option, the attribute value changes to 1. However, when switching back to the “All Status” option, the value should reset to 0, but as shown in the image, it displays as “Todos+os+Status”.

Code snippets

<div>
    <flux:select wire:model="{{ $attributes->wire('model')->value }}"
                 wire:change="{{ $attributes->wire('change')->value }}">
        <flux:option value="0">Todos os Status</flux:option>
        <flux:option value="1">Ativos</flux:option>
        <flux:option value="2">Excluídos</flux:option>
    </flux:select>
</div>

<x-filters.status wire:model="statusSearch" wire:change="filter" autofocus/>

How do you expect it to work?

I expect the value in the URI to be set to 0, not “Todos+os+Status”.

Please confirm (incomplete submissions will not be addressed)

• I have provided easy and step-by-step instructions to reproduce the bug.
• I have provided code samples as text and NOT images.
• I understand my bug report will be closed if I haven't met the criteria above.

[joshhanley]

@gustavosobrinho01 thanks for reporting! Can you try using a value other than 0 and see if that works? I suspect there as an issue with how the select is handling a zero value

[gustavosobrinho01]

With another value, it works, but it should also work with 0, as another value does not meet my needs.

[joshhanley]

@gustavosobrinho01 yeah agreed, I just wanted to make sure it wasn’t an issue with the first item in the select vs a problem with a 0 value

[thobiasvicente]

I'm experiencing the same issue.

This behavior is impacting the filter functionality since the expected numeric value isn't being properly set in the URL parameters.

Environment where I reproduced:

• Flux: v1.1.2
• Livewire: v3.5.18

[jeffchown]

@gustavosobrinho01 What @joshhanley suspects is probably the case, but I'm curious... If you change your components/filters/status.blade.php to:

<div>
    <flux:select {{ $attributes }}>
        <flux:option value="0">Todos os Status</flux:option>
        <flux:option value="1">Ativos</flux:option>
        <flux:option value="2">Excluídos</flux:option>
    </flux:select>
</div>

and your view code to:

<x-filters.status wire:model.number="statusSearch" wire:change="filter" autofocus/>

does it make any difference?

[gustavosobrinho01]

@jeffchown the same problem happens.

[jeffchown]

Thanks for trying, @gustavosobrinho01

I thought the wire:model.number might cast the value and work. Took a shot.

Looks like it's in @joshhanley 's hands.

[joshhanley]

Thanks @gustavosobrinho01 and @jeffchown! I've submitted a PR with a fix.

Turns out we had @if ($value) value="{{ $value }}" @endif when is falsy for a 0 value. So I've updated it to @if (isset($value)) value="{{ $value }}" @endif.

If you use the listbox variant though, it works fine, so that could be a work around for now <flux:select variant="listbox">.

Volt component I used for testing:

<?php

use Livewire\Volt\Component;

new class extends Component {
    public $status = '';
};
?>

<div>
    <flux:text>Status: {{ $status }}</flux:text>
    <select wire:model.live="status">
        <option value="">Default</option>
        <option value="0">Zero</option>
        <option value="1">One</option>
        <option value="2">Two</option>
    </select>
    <flux:select wire:model.live="status">
        <flux:option value="">Default</flux:option>
        <flux:option value="0">Zero</flux:option>
        <flux:option value="1">One</flux:option>
        <flux:option value="2">Two</flux:option>
    </flux:select>
    <flux:select variant="listbox" wire:model.live="status">
        <flux:option value="">Default</flux:option>
        <flux:option value="0">Zero</flux:option>
        <flux:option value="1">One</flux:option>
        <flux:option value="2">Two</flux:option>
    </flux:select>
</div>

[jeffchown]

Thanks, @joshhanley

[gustavosobrinho01]

@joshhanley Thanks, but I didn't find this PR and I ran the update and nothing came.

[jeffchown]

@gustavosobrinho01 Josh's PR won't be in the Flux public repo. And, it won't be available via composer update until Caleb merges the PR into a new Flux Pro release.