checkbox not displayed according to wire:model
If anyone can help:
The problem here is that the value updates on the table but the checkbox itself doesnt update. Am I forgetting to put something in the label or the input? In other words, even though a true/false argument is passed correctrly to the table, it isnt passed to the blade! It always appears unchecked
class PersonalSettings extends Page
{
// use pagePermissions;
//protected static ?string $navigationIcon = 'carbon-user-profile';
protected static ?string $navigationGroup = 'System';
protected static string $view = 'filament.pages.personal-settings';
public $user;
public $timeInput;
public $timeOutput;
public $has_advanced_time_input;
protected $rules = [
'has_advanced_time_input' => 'boolean',
];
public function mount()
{
$this->user = Auth()->User();
$this->user->has_advanced_time_input = $this->has_advanced_time_input;
// Irrelevant for now
ActionsAction::make('updateProfile')
->action(function (Collection $records, array $data): void {
foreach ($records as $record) {
// dd($record);
$record->author()->associate($data['authorId']);
$record->save();
}
})
->form([
Select::make('authorId')
->label('Author')
->options(User::query()->pluck('name', 'id'))
->required(),
]);
}
public function updateTimeDemo()
{
$this->timeOutput = TimeRegistration::convertTimeString($this->timeInput);
}
public function save()
{
$this->user->update([
'has_advanced_time_input' => $this->has_advanced_time_input
]);
Notification::make()
->title('Saved successfully')
->success()
->send();
$this->user->save();
}
}
class PersonalSettings extends Page
{
// use pagePermissions;
//protected static ?string $navigationIcon = 'carbon-user-profile';
protected static ?string $navigationGroup = 'System';
protected static string $view = 'filament.pages.personal-settings';
public $user;
public $timeInput;
public $timeOutput;
public $has_advanced_time_input;
protected $rules = [
'has_advanced_time_input' => 'boolean',
];
public function mount()
{
$this->user = Auth()->User();
$this->user->has_advanced_time_input = $this->has_advanced_time_input;
// Irrelevant for now
ActionsAction::make('updateProfile')
->action(function (Collection $records, array $data): void {
foreach ($records as $record) {
// dd($record);
$record->author()->associate($data['authorId']);
$record->save();
}
})
->form([
Select::make('authorId')
->label('Author')
->options(User::query()->pluck('name', 'id'))
->required(),
]);
}
public function updateTimeDemo()
{
$this->timeOutput = TimeRegistration::convertTimeString($this->timeInput);
}
public function save()
{
$this->user->update([
'has_advanced_time_input' => $this->has_advanced_time_input
]);
Notification::make()
->title('Saved successfully')
->success()
->send();
$this->user->save();
}
}
1 Reply
<x-filament::page>
<x-filament::section>
<x-slot name="heading">
Data input
</x-slot>
<x-slot name="description">
This allows power users to make the interface of this website more optimal for their use.
</x-slot>
<label>
<x-filament::input.checkbox wire:model="has_advanced_time_input" wire:change="save()"/>
<span>
Use an advanced time input fields that allow hour entry using only your keyboard.
</span>
</label>
@if($this->user->has_advanced_time_input)
<div style="margin-top:30px;">
<p>Please give the advanced time entry a try:</p>
<br />
<p>
<strong>Input</strong><br />
<input class="bg-gray-200 dark:bg-white/10 rounded-xl" style="width:100%;" type="text"
wire:model="timeInput" wire:change="updateTimeDemo()">
<br /><br />
<strong>Output</strong><br />
<input class="bg-gray-200 dark:bg-white/10 rounded-xl" style="width:100%;" type="text"
wire:model="timeOutput" disabled>
<br /><br />
A few examples to enter 1 hour and 30 minutes: <br />
<strong>1h30, 1h30m, 1:30, 90 minutes, 90m, 1.5h, 1.5 hours, 1 hour 30 min</strong>
</p>
</div>
@endif
</x-filament::section>
</x-filament::page>
<x-filament::page>
<x-filament::section>
<x-slot name="heading">
Data input
</x-slot>
<x-slot name="description">
This allows power users to make the interface of this website more optimal for their use.
</x-slot>
<label>
<x-filament::input.checkbox wire:model="has_advanced_time_input" wire:change="save()"/>
<span>
Use an advanced time input fields that allow hour entry using only your keyboard.
</span>
</label>
@if($this->user->has_advanced_time_input)
<div style="margin-top:30px;">
<p>Please give the advanced time entry a try:</p>
<br />
<p>
<strong>Input</strong><br />
<input class="bg-gray-200 dark:bg-white/10 rounded-xl" style="width:100%;" type="text"
wire:model="timeInput" wire:change="updateTimeDemo()">
<br /><br />
<strong>Output</strong><br />
<input class="bg-gray-200 dark:bg-white/10 rounded-xl" style="width:100%;" type="text"
wire:model="timeOutput" disabled>
<br /><br />
A few examples to enter 1 hour and 30 minutes: <br />
<strong>1h30, 1h30m, 1:30, 90 minutes, 90m, 1.5h, 1.5 hours, 1 hour 30 min</strong>
</p>
</div>
@endif
</x-filament::section>
</x-filament::page>
<label>
<x-filament::input.checkbox wire:model.change="has_advanced_time_input" wire:change="save()"/>
{{dd($has_advanced_time_input)}}
<span>
Use an advanced time input fields that allow hour entry using only your keyboard.
</span>
</label>
<label>
<x-filament::input.checkbox wire:model.change="has_advanced_time_input" wire:change="save()"/>
{{dd($has_advanced_time_input)}}
<span>
Use an advanced time input fields that allow hour entry using only your keyboard.
</span>
</label>