Questions tagged [tempus-dominus-datetimepicker]

Tempus Dominus is the new version of Eonasdan datetimepicker. It supports Bootstrap 3 and Bootstrap 4 and it has is completely rewritten in ES6. For just a datepicker, see [tag:bootstrap-datepicker]; use [tag:eonasdan-datetimepicker] for the previous version (only Bootstrap 3).

Tempus Dominus is the new version of Eonasdan datetimepicker.

It supports Bootstrap 3, Bootstrap 4 and possibly other UI frameworks. This new version has been completely rewritten in ES6 and uses Babel to transpile the code down.

For more info see https://github.com/Eonasdan/tempus-dominus

Basic sample

<div class="row">
  <div class="col-sm-6">
    <div class="form-group">
      <div class="input-group date" id="datetimepicker1" data-target-input="nearest">
        <input type="text" class="form-control datetimepicker-input" data-target="#datetimepicker1"/>
        <span class="input-group-addon" data-target="#datetimepicker1" data-toggle="datetimepicker">
          <span class="glyphicon glyphicon-calendar"></span>
        </span>
      </div>
    </div>
  </div>
</div>
$(function () {
  $('#datetimepicker1').datetimepicker();
});
116 questions
10
votes
2 answers

How to show 24 hour time picker in tempusdominus plugin

I'm using this plugin https://tempusdominus.github.io/bootstrap-4/ to insert a datetimepicker. I would display time picker showing time in 24 hours (i.e not showing 02:00 PM but 14:00). There a way to perform this, with tempusdominus plugin. I…
Linda
  • 103
  • 1
  • 1
  • 5
9
votes
3 answers

How can I get date object from a bootstrap-datetime-picker plugin?

I am trying to utilize tempusdominus-datetimepicker-3 to create a date-time picker in my html-forms. However, I need to be able to get the selected date from it. The plugin has an option called date which according to the document should return a…
8
votes
2 answers

Setting the calendar value using viewDate function in Tempus Dominus

What I am trying to do is set the month and year from an event calendar to Tempus Dominus datepicker. So on the main page is a big calendar, the user may change the month from November to December, and the create a new event in December. Once the…
MaxThrust
  • 137
  • 2
  • 2
  • 9
5
votes
3 answers

Icons of datetimepicker not showing

I use bootstrap 4,fontawesome v5.7 and this plugin https://tempusdominus.github.io/bootstrap-4/Usage/ The calendar its working but my probleme is the icons is not showing Look this screen:
3
votes
1 answer

Rails 7 import map trouble

I want include js into my html file application.html.erb Meetings
3
votes
1 answer

tempus dominus pre select multidate from value attribute

I'm able to select multiple dates, then save it to database. When reading back from DB, the value attribute of the input field has all previously selected dates in it:
michal
  • 327
  • 4
  • 15
3
votes
0 answers

Tempus Dominus allowMultiDate incorrectly places current date into input field

I am trying to implement a multidate input with Tempus Dominus. I set the picker to display a month or so in advance. I have useCurrent set to false. When I select a date from the picker a month or so in advance the current date is inserted also and…
3
votes
1 answer

Tempus Dominus - setting date with javascript

I am using Tempus Dominus Bootstrap-4 datetime picker in a modal window that is shown when user double clicks on a specific row of a table: $('#btn_modal').on('click', function() { // // .... some irrelevenat code, like geting data of a…
3
votes
3 answers

Tempus Dominus Bootstrap 4 change the language/locale

In the TempusDominusBootstrap 4 options, I set the locale with (locale: moment.locale ('ru')) by first connecting the following dependencies (import * asmoment from 'moment';import 'moment / locale / en';import 'moment-timezone';) I do not get the…
3
votes
3 answers

Set several initial dates in inline datetimepicker tempusdominus

I'm trying to set up the datetimepicker on https://tempusdominus.github.io/bootstrap-3/ and configure it to be used inline. It is initialized with: $('#datetimepicker5').datetimepicker({ inline: true, allowMultidate: true, …
2
votes
1 answer

Set locale for Tempus Dominus Bootstrap 4

I am trying to set the language/locale for the datetimepicker using Tempus Dominus for Bootstrap 4. I followed to the suggestions in Tempus Dominus Bootstrap 4 change the language/locale but nothing seems to work. I would like to set the locale to…
Vroni
  • 347
  • 1
  • 5
  • 16
2
votes
0 answers

Tempus Dominus not validating date range

I'm using Tempus Dominus Bootstrap 4, version 5.0.1 in my ASP.Net application (VS 2017, .Net framework 4.7) along with Bootstrap version 4.5.0. In my Payment page, while initialising the DateTimePicker in the aspx section, I'm setting the minDate…
2
votes
0 answers

Tempus dominus from bootstrap4

I have the next problem: I'm trying to install Tempus dominus of bootstrap but I have these bug when I try to put it, the modal body don't cover all the calendar, and in the footer, it would show a clock icon for additional time. What do you…
user13453074
2
votes
1 answer

Tempus Dominus plugin date not setting when manually inputted

I'm using the Tempus Dominus plugin for bootstrap 4. When i set the date/time using the picker icon and then submit it works fine. If i manually change the date/time via direct entry in the text box it visually updates, but when i submit its the…
A Houghton
  • 372
  • 5
  • 18
2
votes
0 answers

Tempus Dominus not displaying HTML value tag

I'm trying to use Tempus Dominus (for Bootstrap 4) and I can't seem to make it work, when using dynamic data, generated by the Django template. Right now, Django generates this input block and this is how the browser perceives it.
1
2 3 4 5 6 7 8