Using 24 hour time in bootstrap timepicker

Question

Hi im using http   eonasdan github io bootstrap-datetimepicker  on bootstrap  specifically example number 4   I added this property to take away the PM thing and be able to use 24 system on the widget itself      format   hh mm     But lets say I pick 16 00 on the widget it shows up at 04 00 on the input itself as opposed to 16 00   I could not find anything in the documentation about this so if anyone knows a fix for this it would be really appreciated   Thanks

User · Answer

lt script gt            function                  setting time                timepicker   datetimepicker               format    HH mm ss                          lt  script gt    Example bootstrap datetimepicker eonasdan

User · Answer

time-picker   timepicker               showMeridian  false                    This will work

User · Answer

lt input type  text  name  time  data-provide  timepicker   id  time  class  form-control  placeholder  Start Time  value      gt        time   timepicker           timeFormat   H i            scrollDefaultNow          true            closeOnWindowScroll       true            showDuration             false           ignoreReadonly           true        work for me

User · Answer

Use capitals letter for hours HH   24 hour format an hh   12 hour format  x000D   x000D      fecha   datetimepicker   x000D     format    DD MM YYYY HH mm  x000D      x000D   x000D   x000D

User · Answer

It looks like you have to set the option for the format with data-date-   This example works for me with 24h support

User · Answer

EDIT   There are much better answers on this thread than this one   I was just getting the hang of JavaScript at the time I answered   Specifically  see these two   If you search within the development version of that script  there s a function called use24hours that looks for a value of either true or false   Adding use24hours true might do the job for you  Like so     function              datetimepicker5   datetimepicker           use24hours  true

User · Answer

And this works for me     function              datetimepicker5   datetimepicker           format   HH mm

User · Answer

Timepicker     timepicker   timepicker     showInputs  false    showMeridian  false   24hr mode

User · Answer

This works for me     function              datetimepicker5   datetimepicker           use24hours  true          format   HH mm                Important  It only worked at the point I used uppercase  H  as time format

User · Answer

It looks like you have to set the option for the format with data-date-   This example works for me with 24h support    lt div class  form-group  gt       lt div class  input-group date timepicker          data-date-format  HH mm          data-date-useseconds  false          data-date-pickDate  false  gt            lt input type  text  name      gt           lt div class  input-group-addon  gt               lt i class  fa fa-clock-o  gt  lt  i gt           lt  div gt       lt  div gt   lt  div gt

User · Answer

if you are using bootstrap time picker  use showMeridian property to make the time picker 24 hours format       time-picker   timepicker               showMeridian  false

User · Answer

YYYY-MM-DD HH mm ss    gt  24 hours format    YYYY-MM-DD hh mm ss    gt  12 hours format    the difference is letter  H

User · Answer

The below code is correct answer for me        datetimepicker6   datetimepicker                       format    YYYY-MM-DD HH mm

User · Answer

This will surely help on bootstrap timepicker  format   DD MM YYYY HH mm

User · Answer

To pick only time with 24 hr time format  use      datetimepicker   datetimepicker               format   HH mm         If you want to pick 24 hr time format with date also  use      datetimepicker   datetimepicker            format   MM DD YYYY HH mm         Example     x000D   x000D    function     x000D        datetimepicker1   datetimepicker   x000D              format   HH mm  x000D        x000D     x000D        datetimepicker2   datetimepicker   x000D              format   MM DD YYYY HH mm  x000D        x000D        datetimepicker3   datetimepicker   x000D        format   hh mm A   x000D        x000D      x000D   lt script src  https   cdnjs cloudflare com ajax libs jquery 1 12 4 jquery min js  gt  lt  script gt  x000D   lt script src  https   cdnjs cloudflare com ajax libs moment js 2 15 1 moment min js  gt  lt  script gt  x000D   lt script src  https   cdnjs cloudflare com ajax libs twitter-bootstrap 3 3 7 js bootstrap min js  gt  lt  script gt  x000D   lt script src  https   cdnjs cloudflare com ajax libs bootstrap-datetimepicker 4 7 14 js bootstrap-datetimepicker min js  gt  lt  script gt  x000D   x000D   lt link rel  stylesheet  href  https   cdnjs cloudflare com ajax libs twitter-bootstrap 3 3 7 css bootstrap min css  gt  x000D   lt link rel  stylesheet  href  https   cdnjs cloudflare com ajax libs bootstrap-datetimepicker 4 7 14 css bootstrap-datetimepicker min css  gt  x000D   x000D   lt div class  container  gt  x000D     lt div class  row  gt  x000D       lt div class  col-sm-6  gt  x000D         lt div class  form-group  gt  x000D           lt span gt Select 24 hour time format lt  span gt  x000D           lt div class  input-group date  id  datetimepicker1  gt  x000D             lt input type  text  class  form-control    gt  x000D             lt span class  input-group-addon  gt  x000D               lt span class  glyphicon glyphicon-calendar  gt  lt  span gt  x000D             lt  span gt  x000D           lt  div gt  x000D           lt br  gt  x000D           lt span gt Select time with Date lt  span gt  x000D           lt div class  input-group date  id  datetimepicker2  gt  x000D             lt input type  text  class  form-control    gt  x000D             lt span class  input-group-addon  gt  x000D               lt span class  glyphicon glyphicon-calendar  gt  lt  span gt  x000D             lt  span gt  x000D           lt  div gt  x000D           lt br  gt  x000D           lt span gt Select 12 hour time format lt  span gt  x000D           lt div class  input-group date  id  datetimepicker3  gt  x000D             lt input type  text  class  form-control    gt  x000D             lt span class  input-group-addon  gt  x000D               lt span class  glyphicon glyphicon-calendar  gt  lt  span gt  x000D             lt  span gt  x000D           lt  div gt  x000D         lt  div gt  x000D       lt  div gt  x000D     lt  div gt  x000D   lt  div gt  x000D   x000D   x000D    For more info

[javascript] Using 24 hour time in bootstrap timepicker

Examples related to javascript

Examples related to twitter-bootstrap