We Keep Coding

How to change the bootstrap datetimepicker to display only dates and not time

I have several inputs with dates. I don't need time, but somehow I can't get rid of it.
I tried all the solutions I found on StackOverflow without success.
I am using the tempusdominus datetimepicker.
JS FIDDLE LIVE DEMO
Does anyone know how can I remove the option to enter hours and minutes?
I thought format: 'MM/DD/YYYY' would do the trick but apparently it's not working.
$('#monthDatetimepicker').datetimepicker({
defaultDate: date,
viewMode: 'days',
format: 'MM/DD/YYYY'
});

You need to set the default options so that it applies to newly created date[time]pickers:
From the options page on how to set global defaults:
$.fn.datetimepicker.Constructor.Default = $.extend({}, $.fn.datetimepicker.Constructor.Default, {
viewMode: 'days',
format: 'MM/DD/YYYY',
});
Updated fiddle
Your issue was that this line
$('#monthDatetimepicker').datetimepicker({
format: 'MM/dd/YYYY'
doesn't get applied to anything as $('#monthDatetimepicker') === 0 at the time the code runs.
Moving that line to the end also does nothing as your newly created date inputs have id="monthDatetimepicker" + i. Changing to a valid ID such as:
$('#monthDatetimepicker0').datetimepicker({
format: 'MM/dd/YYYY'
then only works for the first picker.
So you could do some hideous $("[id=^monthDatetimepicker]").datetimepicker... or, easier, you could add a class into your html builder and use that as a selector. Or set it globally as above (which will affect other pickers unless they had a different format applied). (or use a datepicker instead...)

Add .substring(0,10) at the end.

bootstrap-datepicker does not update AngularJS model when picking date

I am using AngularJS with this bootstrap-datepicker plugin:
Datepicker for Bootstrap v1.6.4 (https://github.com/eternicode/bootstrap-datepicker)
Copyright 2012 Stefan Petre
Improvements by Andrew Rowls
I have it bound like this:
<input type="text" data-provide="datepicker" ng-model="obj.FirstDate" />
I get the values to inputs using ng-model.
When I type the date into this field using keyboard it all works OK, but when I click on a field and select a date from the Datepicker:
the model doesn't get updated,
the field is not treated as dirty (no ng-dirty class).
Is there a way to tell Angular to update value of obj.FirstDate when using the Datepicker? For example to attach it to an event? Or any other way that this would work?
I have a few of these fields so I don't want to write the script which attaches to a field using its id. Any help appreciated.

After much time of struggling with this I was forced to use below code to fix every of my datepicker instances at once:
function fixDatepickerTriggerChange() {
$(document).ready(function () {
$('[data-provide="datepicker"]').datepicker().on('changeDate', function (e) {
angular.element($(this)).triggerHandler('input');
});
});
}
And run it from within the angular.controller.
Based on this answer: https://stackoverflow.com/a/23850753/1813219.

Add a few months to bootstrap DateTimePicker calendar after change event

I'm using the date picker from eonasdan. I am trying to add three months to the second calendar as soon as I pick a date from the first. I have tried using the moment().add(3,'M') method, but it doesn't work as I am expecting it to.
I'm just trying to do two simple, interrelated, tasks:
Add three months to the second calendar's minDate
Display that date in the calendar's <input> field. The JS for the calendars is below.
$('#start-date').datetimepicker({
useCurrent:false,format: 'D-M-YYYY'
});
$("#start-date").on("dp.change", function (e) {
var probDate = new Date(e.date().add(3,'M'));
$('#probation-date').data("DateTimePicker").minDate(e.date);
});
$("#end-date").on("dp.change", function (e) {
$('#start-date').data("DateTimePicker").maxDate(e.date);
});
I tried to made a JSFiddle, but there's no way to include external files via a CDN for this widget. It's MomentJS knowledge that I lack here.

How can I get the new value of an HTML input after a click event has modified it?

I have the following..
# Html.EditorFor ( model = > model.Date )
A template editor also works in the DateTime type
Clicking on this entry, a calendar is displayed , you select a calendar date , and that date
is the new value of my post. What I need is to validate that the date you select is equal or greater than today.
I tried the onchange event for the EditorFor , but it did not work , Jquery DatePicker property has a MinDate
but added that would mean modifying the operation of all entries with the DateTime data type .

jQuery Datepicker has onSelect function which will give you the chosen date that is displayed in date input box! Here is a fiddle http://jsfiddle.net/aa74R/66/
onSelect: function(dateText, inst) {
var date = $(this).datepicker('getDate');
alert(date);
}

The Question is a bit vague, however I think this should help.
It looks like what you want to do is change the date, based on after you've selected a newDate. onChange should work. As far as why it isn't, it could be a matter of code.
If it's a matter of how you've written your code:
$('#inputId').on('change', function(){
var newDate = $(this).val();
});
I personally think this might be an easier approach for some, however inefficient as it persistently sets the date every time you leave the field:
$('#inputId').on('blur', function(){
var newDate = $(this).val();
});
There are also many other ways to write it. But I feel like this might have the proper level for you.

Question doesn't seem to have a context with the absence of code.
Since you have tagged jQuery a possible problem might be you are binding the onchange event to the textbox. If this textbox were to be dynamically generated, the onchange event would never be registered. If this is your problem then you could do this-
$("body").on("change", "#textBoxId", function(){
alert($(this).val());
});

in jquery datepicker can add alt field with classname?

hi I am using jquery ui datepicker
in starting i set datepicker with following way
$(".td-datepicker).datepicker();
class .td-datepicker apply on four input text box and their id are following
#startdate
#enddate
#edit_startdate,
#edit_enddate
now i want to set alt field in all four input field
how can i add by class because if i add by id then repetition of code occur
like below
$('#startdate').datepicker("option","altField","#alt_startdate");
$('#startdate').datepicker("option","altFormat","mm/dd/yy");
$('#enddate').datepicker("option","altField","#alt_enddate");
$('#enddate').datepicker("option","altFormat","mm/dd/yy");
$('#edit_startdate').datepicker("option","altField","#alt_edit_startdate");
$('#edit_startdate').datepicker("option","altFormat","mm/dd/yy");
$('#edit_enddate').datepicker("option","altField","#alt_edit_enddate");
$('#edit_enddate').datepicker("option","altFormat","mm/dd/yy");
and can i add multiple option in datepicker after initialization
like for
$('#edit_enddate').datepicker("option","altField","#alt_edit_enddate");
$('#edit_enddate').datepicker("option","altFormat","mm/dd/yy");
can i write code for above two line in one line . is this any way ?

To change the altFormat on all of them, assuming they've the same format:
$(".td-datepicker").datepicker("option", "altFormat", "mm/dd/yy");
For the multiple options at once (example):
$(".td-datepicker").datepicker("option", {
disabled: true,
dateFormat: "dd/mm/yy"
});
To solve your issue, based on the ids you're using:
$(".td-datepicker").each(function (idx, el) {
$(this).datepicker("option", "altField", "#alt_" + $(this).attr("id"));
});
If you change your mind, yes, you can use classes instead.
It's all on the API documentation: http://api.jqueryui.com/datepicker/