Filament•16mo ago

datepicker state update

                          Forms\Components\DatePicker::make('plan_started')
                                ->afterStateUpdated(function (Closure $set, Closure $get, $state) {
                                    $state = Carbon::parse($state);
                                    $set('plan_expires', $get('plan_term') == 'year' ? $state->addYear() : $state->addMonth());
                                })->format('Y-m-d')
                                ->displayFormat('d-m-Y'),
                            Forms\Components\DatePicker::make('plan_expires')
                                ->disabled()
                                ->format('Y-m-d')
                                ->displayFormat('d-m-Y')

                          Forms\Components\DatePicker::make('plan_started')
                                ->afterStateUpdated(function (Closure $set, Closure $get, $state) {
                                    $state = Carbon::parse($state);
                                    $set('plan_expires', $get('plan_term') == 'year' ? $state->addYear() : $state->addMonth());
                                })->format('Y-m-d')
                                ->displayFormat('d-m-Y'),
                            Forms\Components\DatePicker::make('plan_expires')
                                ->disabled()
                                ->format('Y-m-d')
                                ->displayFormat('d-m-Y')

i want to select a date in 'plan_started' datepicker and using that date for 'plan_expires'. in filament v2 i used this code and works like i wanted. in v3 it is not works.i look at changes and see the 'closure' was changed to 'Set' and 'Get' but still i could not succeed. how should i change the codes ? thanks

4 Replies

cheesegrits•16mo ago

You need to make the first date field reactive()

mugiwaraOP•16mo ago

sorry i delete when i try to figure out. there is reactive() in the working code (v2) but still i couldnt work in (v) v3

cheesegrits•16mo ago

I do exactly this, setting an end date by adding a period to the start date, in v3. So it definitely works. What does debugging tell you? Is the afterStateUpdated() method getting called?

mugiwaraOP•16mo ago

`                                
Forms\Components\DatePicker::make('plan_started')
                      ->reactive()
                      ->afterStateUpdated(function (Get $get, Set $set, ?string $state) {
                          Log::debug('state', [$state]);
                          $state = Carbon::parse($state);
                          $exp = $get('plan_term') == 'year' ? $state->addYear() : $state->addMonth();
                          $set('plan_expires', $exp);
                          Log::debug('exp date', [$exp]);
                      })
                      ->format('Y-m-d')
                      ->displayFormat('d-m-Y'),


Forms\Components\DatePicker::make('plan_expires')
                      ->format('Y-m-d')
                      ->displayFormat('d-m-Y')
                      ->disabled(),

`                                
Forms\Components\DatePicker::make('plan_started')
                      ->reactive()
                      ->afterStateUpdated(function (Get $get, Set $set, ?string $state) {
                          Log::debug('state', [$state]);
                          $state = Carbon::parse($state);
                          $exp = $get('plan_term') == 'year' ? $state->addYear() : $state->addMonth();
                          $set('plan_expires', $exp);
                          Log::debug('exp date', [$exp]);
                      })
                      ->format('Y-m-d')
                      ->displayFormat('d-m-Y'),


Forms\Components\DatePicker::make('plan_expires')
                      ->format('Y-m-d')
                      ->displayFormat('d-m-Y')
                      ->disabled(),

` and the log

[2023-09-03 12:30:33] local.DEBUG: state ["2023-09-22"] 
[2023-09-03 12:30:33] local.DEBUG: exp date ["2023-10-22 00:00:00"]

[2023-09-03 12:30:33] local.DEBUG: state ["2023-09-22"] 
[2023-09-03 12:30:33] local.DEBUG: exp date ["2023-10-22 00:00:00"]

` but i cant see the plan expires date in datepicker i also try like this for is set method set to the plan_expires

`  Log::debug('exp date', [$get('plan_expires')]);

`  Log::debug('exp date', [$get('plan_expires')]);

` this is also give a correct log i solved my problem when i look again the logs, i think about may the reason date format after the adding year or month so i did this

` $set('plan_expires', $exp->format('Y-m-d'));

` $set('plan_expires', $exp->format('Y-m-d'));

` after that when i pick a date in plan started it showed me expire date based on selected option from plan term thank again

Gaming

Programming

datepicker state update