I wanted compare the date (input type="date" in HTML5) with the date Objekt in Angular2 but there is no way to compare them. I there a easy way to do it ?
<label> Create Date: </label>
<input class="form-control" [ngModel]="chart.createDate"
(ngModelChange)="chart.createDate = $event"
type="date"
data-date="" data-date-format="DD MMMM YYYY"
required #createDate="ngModel" name="createDate"/>
<div *ngIf="Date.parse(chart.createDate).getTime() < dateControll.getTime()">
- date is older than today
</div>
I did it like this:
if (varDate1.valueOf() > varDate2.valueOf()) {
// do this and that...
}
but both needs to be defined as Date in Angular...
Related
I have a date that comes from a Bootstrap DateTimePicker $('#datetimepicker').find("input").val() that has the format "mm/dd/yyyy".
<div class='input-group date' id='datetimepicker'>
<form autocomplete="off" onkeydown="return event.key != 'Enter';">
<input type='text' autofill="off" readonly class="form-control" />
</form>
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
I'm trying to get the UTC date and time for the selected date, at midnight, using Moment js:
moment.utc($('#datetimepicker').find("input").val()).tz(timezone).format('YYYY-MM-DD HH:mm:ss')
For example, starting date from the picker is 01/21/2022 and the timezone is America/Phoenix which is UTC-7.
I should have 2022-01-21 07:00:00 but my code returns 2022-01-20 17:00:00.
What am I doing wrong? Is there a way to get the UTC time for a day at 00:00 time, just by knowing the timezone?
You have to create the timestamp in your local timezone first, and then convert it to UTC. You are doing it the other way around. Ie if I split up your code snippet, you are doing the following
let thedate = $('#datetimepicker').find("input").val();
let utcdate = moment.utc(thedate);
let localdate = utcdate.tz(timezone);
Thus, the timezone offset is, of course, added in the wrong direction ...
Try the following
function getTime() {
let thedate = $('#thedate').val();
console.log(thedate)
// create a timestamp in the respective timezone
let localdate = moment.tz(thedate, "America/Phoenix");
// convert it to utc
let utcdate = localdate.utc();
// format the timestamp
console.log(utcdate.format("YYYY-MM-DD HH:mm:ss"));
}
<script src="https://momentjs.com/downloads/moment.js"></script>
<script src="https://momentjs.com/downloads/moment-timezone-with-data.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="thedate" type="date">
<input type="button" onClick="getTime()" value="Get Time">
I have some problem when I want to get the date from JSON that output in format 31-10-2019 07:00:00, I want to change that format to YYYY-MM-DD, but at the moment, the field still displays dd/mm/yyyy, for more detail look at my code :
<FormGroup>
<Label for="expiredDate">Expired Date</Label>
<Input
type="date"
name="expiredDate"
onChange = {this.handleForm}
value = {moment(new Date(expiredDate)).format("YYYY-MM-DD")}
placeholder="date placeholder"
min = {moment().format("YYYY-MM-DD")}/>
</FormGroup>
IN User Interface
Fixed it with
moment(expiredDate, 'DD/MM/YYYY hh:mm:ss').format('YYYY-MM-DD')
I would like to insert date-picker into my form, which shows me automatically today's date without choosing a date. The from below makes you choose the date, any one can help me please with that..
<div class="form-group">
<label class="container" for="name">Erän saapumispäivä :</label>
<div class="col-sm-5">
<input type="date" class="form-control" id="Entery_Date"
[(ngModel)]="addProduct.Entery_Date" name="Entery_Date" #Entery_Date="ngModel">
<div *ngIf="Entery_Date.errors && (Entery_Date.dirty || Entery_Date.touched)" class="alert alert-danger">
<div [hidden]="!Entery_Date.errors.required">
Erän saapumispäivä on pakollinen!
</div>
</div>
</div>
It is a good idea to use material Date Picker (https://material.angular.io/components/datepicker/overview)
It should meet all your requirements
Please take a look to the below example.
<input name="dateInput" type="date" ng-model="date"/>
Now, in your controller use the below code:
var d=new Date();
var year=d.getFullYear();
var month=d.getMonth()+1;
if (month<10){
month="0" + month;
};
var day=d.getDate();
$scope.date=year + "-" + month + "-" + day;
Hope this will work :)
How can I limit(disable days buttons) bootstrap-datepicker(not jQuery Datapicker) calendar date in this way:
id_date_stop can't be < id_date_start so
if I select date_start as
06-05-2016, date_stop can't be earlier than 06-05-2016.
It can be
from 06-05-2016 to 10-05-2016(todays date).
my html:
<div class="input-group date" data-provide="datepicker" data-date-end-date="0d">
<input id="id_date_start" name="data_start" type="text">
<div class="input-group-addon"></div>
</div>
<div class="input-group date" data-provide="datepicker" data-date-end-date="0d">
<input id="id_date_stop" name="date_stop" type="text">
<div class="input-group-addon"></div>
</div>
You can use jQuery combined with the methods available from bootstrap-datepicker to set the start and end dates.
Sample code would look like this
$('#id_date_start').datepicker({autoClose: true}).on('changeDate',function(e) {
$('#id_date_stop').datepicker({autoClose: true}).datepicker('setStartDate', e.date)
.datepicker('setEndDate', new Date());
})
This code will set a start date for the 'date_stop' datepicker based on your start date selected, and will set the end date to today's date.
I am using the line $('#id_date_start').datepicker({autoClose: true}) before the method calls, to ensure that the datepicker object is initialized. This will ensure that the methods will fire correctly.
Here is a sample fiddle.
I can't see how to get the start and end from a date and time range picker I usually use data-link-field="dtp_input1" to get the data to insert into a table like I code it like this:
<input type="hidden" id="dtp_input1" name="date" value="" /><br/>
Now my code from date and time range picker is like this:
<div class="form-group">
<label>Date and time range:</label>
<div class="input-group">
<div class="input-group-addon"> <i class="fa fa-clock-o"></i>
</div>
<input type="text" class="form-control pull-right" id="reservationtime">
</div>
<!-- /.input group -->
</div>
<!-- /.form group -->
and for the javascript:
$('#reservationtime').daterangepicker({
timePicker: true,
timePickerIncrement: 30,
format: 'MM/DD/YYYY h:mm A'
});
please see my screenschot
how can i code to get start and end and enter it on mysql database
$('#reservationtime').daterangepicker({
timePicker: true, timePickerIncrement: 30,
format: 'MM/DD/YYYY h:mm A'
}).bind('datepicker-change',function(event, obj)
/* This event will be triggered when second date is selected */
console.log('change',obj);
// obj will be something like this:
// {
// date1: (Date object of the earlier date),
// date2: (Date object of the later date),
// value: "2013-06-05 to 2013-06-07"
// }
})