Hello folks,
I would like to update the array for the disabledDates() as soon as the item changes. I tried using afterStateUpdated in the select field for Item, but unfortunately it doesn't work. Then I made the field reactive and wrote a small function that outputs the occupied days based on the item.
When editing, the correct days are loaded for the item (screenshot 1). But if I change the item or add a new one, no data is loaded? How can I make this reactive?
#How can i update field Information when reactive doesnt work
12 messages · Page 1 of 1 (latest)
` Select::make('item_id')
->label('Artikel')
->options(Item::query()->pluck('name', 'id'))
->required()
->reactive()
->columnSpan([
'md' => 5,
'lg' => 2,
])
->afterStateUpdated(fn ($state, Set $set) => $set('price', Item::find($state)?->price ?? 0))
->afterStateUpdated(function (Get $get, Set $set, $state) {
$set('date_range', null);
self::updateTotals($get, $set);
})
->searchable(),
DateRangePicker::make('date_range')
->label('Buchungszeitraum')
->required()
->autoApply()
->columnSpan([
'lg' => 3,
])
->disabledDates(function (Get $get) {
$disabledDates = [];
$itemId = $get('item_id');
if ($itemId) {
$bookings = BookingPosition::where('item_id', $itemId)->get();
foreach ($bookings as $booking) {
$fromDate = \Carbon\Carbon::parse($booking->from_date);
$toDate = \Carbon\Carbon::parse($booking->to_date);
$period = \Carbon\CarbonPeriod::create($fromDate, $toDate);
foreach ($period as $date) {
$disabledDates[] = $date->format('Y-m-d');
}
}
}
return $disabledDates;
})`
Maybe an issue with DateRangePicker, because disabledDates in Filament Date Picker will work using native(false)
https://filamentphp.com/docs/3.x/forms/fields/date-time-picker#disabling-specific-dates
Forms\Components\Select::make('item_id')
->live()
->options([
'1' => 'Option 1',
'2' => 'Option 2',
'3' => 'Option 3',
]),
Forms\Components\DatePicker::make('date')
->native(false)
->disabledDates(fn (Forms\Get $get): array => match ($get('item_id')) {
default => [],
'1' => ['2024-10-21'],
'2' => ['2024-10-22'],
'3' => ['2024-10-23'],
}),
Thank you for your answer.
Is there another way to dynamically reload the data? So far I have only ever found a reference to a custom component, but there must be a way to load the data dynamically via a backend controller logic. Would you have an idea?
this works using DataPicker, actually. I think the issue is DateRangePicker..
OK, I'll try it tomorrow morning. Is it ok if I report back here again?
no problem