TimePicker

Hi Everyone, how I can make TimePicker::make('time') works with 24 hours and not 12 hours system

16 Replies

You can set the PHP display format with ->displayFormat(). But the default should be H:i which is 24h

unicodesOP•5mo ago

I try it still same

 TimePicker::make('time')
   ->label('Time')
   ->displayFormat('H:i')
   ->seconds(false)
   ->required(),

 TimePicker::make('time')
   ->label('Time')
   ->displayFormat('H:i')
   ->seconds(false)
   ->required(),

unicodesOP•5mo ago

@awcodes Hi, you have any idea about this? many thanks

Dennis Koch•5mo ago

Please read our #✅┊rules and don't tag people!

unicodesOP•5mo ago

sorry @Dennis Koch

Aizaysi•5mo ago

hi could you share the full code of that file?

awcodes•5mo ago

->native(false)

unicodesOP•5mo ago

with ->native(false) works but look like this, user can't write inside text field directly wich not a good UX.

TimePicker::make('time')
  ->label('Time')
  ->displayFormat('H:i')
  ->native(false)
  ->seconds(false)
  ->required(),

TimePicker::make('time')
  ->label('Time')
  ->displayFormat('H:i')
  ->native(false)
  ->seconds(false)
  ->required(),

awcodes•5mo ago

Yep. There’s caveats both ways. Native doesn’t allow disabling seconds or using a 24 hour format. That’s up to the browser at that point.

unicodesOP•5mo ago

so there is no way to make input field that accept only 00:00 format ?

awcodes•5mo ago

Not without a custom input. Could potentially do it with a TextInput and a mask. Would just need to make sure the state / casting is handled appropriately if your db field is time based.

unicodesOP•5mo ago

any example to do that with input and mask? and yes field in my DB is time

awcodes•5mo ago

Specifically that use case, no. It should be straightforward. https://filamentphp.com/docs/3.x/forms/fields/text-input#input-masking

Text input - Form Builder - Filament

awcodes•5mo ago

Might want to add some validation around it too so you don’t get things like 32:99 Or a negative time.

unicodesOP•5mo ago

thank you so much I will try that

awcodes•5mo ago

Might even make a good plugin if you get it all working. 🙂

Gaming

Programming

TimePicker