Develop Reference

How to format a string like `2018911` into a Date?

From backend, the date format is like above, and I want to format the date using formatter into a real date. I got a datepicker in my detailpage and the datepicker wants a real date, to show it up.
So I tried a bit, but I can't get it to work. So maybe someone can help me or guide how to do it? I know I can format the date in the backend but I need it that way like above as a string.

If you are using sap.m.DatePicker here an example:
<DatePicker
id="DP2"
value="2014-03-26" valueFormat="yyyy-MM-dd" displayFormat="long"
change="handleChange"
class="sapUiSmallMarginBottom"/>
there's the valueFormat and displayFormat attribute to shape date format as you want.
valueFormat is the date format you want when user click on date and you can grab in oEvent.
displayFormat is the date format you want to show.
Reference SAPUI 5 DatePicker example

Hi you can create a date from teh string you receiving by using below js code
getDate:function(value){
//value is your string from backend "20120515"
if(value){
var dateString = value;
var year = dateString.substring(0,4);
var month = dateString.substring(4,6);
var day = dateString.substring(6,8);
var date = new Date(year, month-1, day);
return date; // Keep in mind the date returned will only be correct if the string is passed in above format
}
}
You can use the above function in formatter.js file and can use in datepicker as below
<DatePicker value="{path:'modelDateProperty', formatter:'.formatter.getDate', }" />
I hope this helps

Set custom date in Bootstrap Date Range Picker

I want to set custom date in Bootstrap Date Range Picker as default like this format below:
Format: [today-7] - [today]
So the first one will show the date 7 days ago from the current date as default and second one will show current date as default.
Here is the source file link of my work: http://securesofts.com/masum.zip
Here is the screenshot where I want it: Date Range Picker
Thanks in Advance.

try something like this:
$('input').daterangepicker(
{
locale: {
format: 'YYYY-MM-DD'
},
startDate: new Date(new Date().getTime() - (60*60*24*7*1000)),
endDate: new Date
}
)

JQ UI DatePicker - timezone

How to force JQ UI DatePicker work in given timezone, not local?
For example: America/Toronto

We could solve this propose with momentJS + set defaultDate option JQ UI DatePicker
//Set default timezone for all new momentJS instances
moment.tz.setDefault('America/Toronto');
//Today date and time in America/Toronto timezone correction
var setDate = moment();
//Set defaultDate in proper date format for datepicker
$(element).datepicker(
{
defaultDate:setDate.format('MM/DD/YYYY')
}
Remember: Don't call toDate() method, use format() for getting proper date and time result in given timezone.

not able to set the yesterday date to kendo ui datepicker

I have got problem with setting date to kendo ui date picker, I am successfully able to set the today date by using the following code :
var todayDate = new Date();
$('#createdonend').data("kendoDatePicker").value(todayDate);
I am not able to set the yesterday date by using following code
var todayDate = new Date();
var yesterdayDate = todayDate.getDate() - 1;
$('#createdonbegin').data("kendoDatePicker").value(yesterdayDate);
for the above function I am getting error like this
Microsoft JScript runtime error: Object doesn't support this property or method
in this file
/Scripts/kendo/2013.2.716/kendo.all.min.js
would any one pls help on this one why i am getting this error for setting yesterday date to kendo ui datepicker..
Many thanks In advance..

As #Niels said you have to use:
yesterdayDate.setDate(today.getDate() - 1);
for setting yesterday date but you need to have yesterdayDate initialized to today's Date before setting it to previous day since setDate only sets the day of the month.
So, the proposed code is:
// Create a "date" object with today's date
var date = new Date();
// Changes the day of the month to previous, this keeps in mind month and year changes
date.setDate(date.getDate() - 1);
// Set the new date
$('#createdonbegin').data("kendoDatePicker").value(date);
Running example in JSFiddle: http://jsfiddle.net/OnaBai/v7UPr/

You will need to use the following:
yesterdayDate.setDate(today.getDate() - 1);
getDate will get the number of days in the month, not a Date object.
The value returned by getDate is an integer between 1 and 31.
Sources:
getDate

How to properly configure jquery-ui datepicker max/min range and initialize default from Rails column?

I'm using jquery-ui datepicker on a User DOB field in a Rails 3.2 app.
I'm trying to achieve the following:
restrict the range of dates that can be selected, max = today, min = 100 years ago.
initialize the datepicker with the date currently stored in the database (if any).
display the selected date in a particular format in the dob text field.
My form looks like this:
<%= form_for #user do |f| %>
<%= f.text_field :dob, :class=>'date-selector-dob', :value => (#user.dob.blank? ? '' : #user.dob.to_s(:long)) %>
<% end %>
where .to_s(:long) is the display format I'm after.
With the following javascript the datepicker works, the text field is properly formatted, but no max/ min date is set, and no initialization with the stored date occurs.
$(function (){ // enabledate picker
$('.date-selector-dob').datepicker();
});
I added to this functions that I though would set min/max range and initialize, as follows:
$(function (){ // enable date picker
$('.date-selector-dob').datepicker({minDate: new Date('-100Y'), maxDate: new Date('-1D')}); // enable datepicker and set range
$('.date-selector-dob').datepicker('setDate', new Date($('.date-selector-dob').attr('value'))); // initialize datepicker with stored value
});
This is initializing the date picker correctly, but is not setting a min/max range. Is my approach incorrect?
In addition, the extended function resets my formatting string, and data is not displayed according to .to_s(:long). Using the basic function above, this formatting string is properly applied. What would cause this?
I'm pulling my hair out with this! I'd really appreciate it if someone can help me see whatever is it I've missed, and understand what I'm doing wrong. Thanks!

JavaScript's Date doesn't know what -100Y or -1D mean so your minDate and maxDate settings aren't going to be anything that the datepicker will understand.
From the fine manual:
minDate
Set a minimum selectable date via a Date object or as a string in the current dateFormat, or a number of days from today (e.g. +7) or a string of values and periods ('y' for years, 'm' for months, 'w' for weeks, 'd' for days, e.g. '-1y -1m'), or null for no limit.
So you want this:
$('.date-selector-dob').datepicker({
minDate: '-100y',
maxDate: '-1d'
});
Demo: http://jsfiddle.net/ambiguous/RQgCW/
If you want the datepicker to use a certain format for the date, use the dateFormat option:
The format for parsed and displayed dates. This attribute is one of the regionalisation attributes. For a full list of the possible formats see the formatDate function.
Also, you should be able to skip this:
$('.date-selector-dob').datepicker('setDate', new Date($('.date-selector-dob').attr('value')))
and just set the <input>'s value attribute to the date (preferably in ISO 8601 format), then the datepicker should be able to take it from there on its own.

At the time of initialize datepicker object we need to pass all our conditions as a hash. In your example you datepicker initialized for second time, that's the problem for not getting date range.
$(function (){
$('.date-selector-dob').datepicker({
dateFormat: 'M dd, yyyy',
minDate: '-1y',
maxDate: '+1m',
});
});
You can set the date by following way, for this you need to specify correct date format(already specified in initializer param as 'dateFormat')
$('#popupDatepicker').val("Feb 13, 2012");