bladewindUI

Timepicker

Display a timepicker.

HH
MM
SS
AM
 

 

Full List Of Attributes

The table below shows a comprehensive list of all the attributes available for the timepicker component.

IMPORTANT: Projects running Laravel 8 please read this

Option Default Available Values
name bw-timepicker This name can be accessed when the input is submitted in the form. The name is also available as part of the css classes.
type single single range
default_date blank In case you are editing a form, the value passed will be set on the value attribute of the timepicker input. <input type="text" value="" ../>
default_date_from blank Default date to set for the From date when using the range timepicker.
default_date_to blank Default date to set for the To date when using the range timepicker.
date_from_label From Placeholder text to display for the From date. Applicable only to range timepickers.
date_to_label To Placeholder text to display for the To date. Applicable only to range timepickers.
placeholder Select a date Placeholder text to display
required false Determines if the placeholder text should have an asterisk appended to it or not. Value needs to be set as a string not boolean.
true false
css bw-timepicker Any additonal css classes can be added using this attribute.

 

timepicker with all attributes defined

                
                    <x-bladewind.timepicker 
                        name="invoice_date"
                        type="single"
                        required="false"
                        placeholder="Invoice Date" 
                        date_from=""
                        date_to=""
                        default_date=""
                        css="shadow-sm" />
                
            

 

The source file for this component is available in resources > views > components > bladewind > timepicker.blade.php

The source language (translation) files for this component are available in lang/en/timepicker.php and lang/fr/timepicker.php

The source javascript file for this component is available in public/bladewind/js/timepicker.js