Filament•16mo ago

How to build Dashboard widget with select

Hey together! I need to build an Dashboard widget with an select, like 1 day, 7 days, 1 month, 3 months, 6 months, 1 year How i can build an widget with this?

Solution:

1) php artisan make:filament-widget TestWidgetSelect 2) Select the option for Livewire 3) You will have something like this: ```php <?php...

Jump to solution

22 Replies

Solution

Matthew•16mo ago

1) php artisan make:filament-widget TestWidgetSelect 2) Select the option for Livewire 3) You will have something like this:

<?php

namespace App\Livewire;

use Filament\Widgets\Widget;

class TestWidgetSelect extends Widget
{
    protected static string $view = 'livewire.test-widget-select';
}

<?php

namespace App\Livewire;

use Filament\Widgets\Widget;

class TestWidgetSelect extends Widget
{
    protected static string $view = 'livewire.test-widget-select';
}

4) Go the blade file and add:

x-filament-widgets::widget>
    <x-filament::section>
        <x-filament::input.wrapper>
            <x-filament::input.select wire:model="status">
                <option value="draft">1 day</option>
                <option value="reviewing">7 days</option>
                <option value="published">1 month</option>
                    ...
            </x-filament::input.select>
        </x-filament::input.wrapper>
    </x-filament::section>
</x-filament-widgets::widget>

x-filament-widgets::widget>
    <x-filament::section>
        <x-filament::input.wrapper>
            <x-filament::input.select wire:model="status">
                <option value="draft">1 day</option>
                <option value="reviewing">7 days</option>
                <option value="published">1 month</option>
                    ...
            </x-filament::input.select>
        </x-filament::input.wrapper>
    </x-filament::section>
</x-filament-widgets::widget>

Matthew•16mo ago

Also dont forget to add the widget to your panel!!

TobiOP•16mo ago

The TestWidgetSelect is directly an Livewire Component? & Thank you very muc much*

Matthew•16mo ago

Nah, sorry thats just how I named the widget No problem. If this works, please mark it as solution so others can see it

TobiOP•16mo ago

Sure Yes, thats right - But you set the model to status - So the "TestWidgetSelect"-Class is directly in the backend an Livewire Component?

Matthew•16mo ago

Yes, as far as I know it is a LIvewire component

TobiOP•16mo ago

Thank you very much

Matthew•16mo ago

Confirmed by the docs: https://filamentphp.com/docs/3.x/widgets/adding-a-widget-to-a-blade-view

Adding a widget to a Blade view - Widgets - Filament

TobiOP•16mo ago

Thank you very much

Matthew•16mo ago

you're welcome:)

TobiOP•16mo ago

I have the issue, that the width isnt still working..

TobiOP•16mo ago

You have an Idea for this?

Matthew•16mo ago

wdym isnt working?

TobiOP•16mo ago

no :/

TobiOP•16mo ago

Matthew•16mo ago

no, like. What do you mean?

TobiOP•16mo ago

the columnSpan It should be fit the 3 columns on the full width

Matthew•16mo ago

you want them spread out evenly?

TobiOP•16mo ago

Yes You have an Idea for this @Matthew ?

Matthew•16mo ago

Yes Go to the Dashboard file (or the LiveWire component) and add this:

protected int | string | array $columnSpan = 'full';

protected int | string | array $columnSpan = 'full';

TobiOP•16mo ago

Already tried, same

TobiOP•16mo ago

But i cant even find the issue

Gaming

Programming

How to build Dashboard widget with select