How to type in the datepicker input box?

For ease of use I would like to be able to type into the datepicker input box instead of having to use the datepicker.

This can be sort of achieved with the following code:

TextInput::make($name)
    ->mask('99/99/9999')
    ->placeholder(__('23/06/1912'))
    ->dehydrateStateUsing(
        fn (string $state): ?Carbon => $state
            ? Carbon::createFromFormat(static::$format, $state)
            : null
    );

TextInput::make($name)
    ->mask('99/99/9999')
    ->placeholder(__('23/06/1912'))
    ->dehydrateStateUsing(
        fn (string $state): ?Carbon => $state
            ? Carbon::createFromFormat(static::$format, $state)
            : null
    );

The downside of this approach is that you lose access to the

minDate()

minDate()

and

maxDate()

maxDate()

methods.

Is there a way to have the best of both worlds?

Filament•3y ago•

4 replies

Proculair B.V.

How to type in the datepicker input box?

For ease of use I would like to be able to type into the datepicker input box instead of having to use the datepicker.

This can be sort of achieved with the following code:

TextInput::make($name)
    ->mask('99/99/9999')
    ->placeholder(__('23/06/1912'))
    ->dehydrateStateUsing(
        fn (string $state): ?Carbon => $state
            ? Carbon::createFromFormat(static::$format, $state)
            : null
    );

TextInput::make($name)
    ->mask('99/99/9999')
    ->placeholder(__('23/06/1912'))
    ->dehydrateStateUsing(
        fn (string $state): ?Carbon => $state
            ? Carbon::createFromFormat(static::$format, $state)
            : null
    );

The downside of this approach is that you lose access to the

minDate()

minDate()

and

maxDate()

maxDate()

methods.

Is there a way to have the best of both worlds?

How to type in the datepicker input box?

Similar Threads

How to type in the datepicker input box?

Similar Threads

Similar Threads

Similar Threads