Develop Reference

Highstocks rangeSelector input with global useUTC: false doesn't work

As the title suggests, I have trouble with the rangeSelector input when setting the global useUTC option to false, i.e. the following setting:
Highcharts.setOptions({
global: {
useUTC: false
}
});
I have two fiddles for demostrating this issue.
Fiddle 1 - Date & hour formatting (works)
Fiddle 1 uses date & time as date formatting option, i.e.
inputDateFormat: "%Y-%m-%d %H:%M:%S",
inputEditDateFormat: "%Y-%m-%d %H:%M:%S"
which is working fine. If you, for example, choose 2010-09-22 00:00:00 as input, it will output From: 2010-09-22 00:00:00+02:00 (since I'm in GMT+2).
Fiddle 2 - Only date formatting (does not work)
Fiddle 2 uses only the date as date formatting option, i.e.
inputDateFormat: "%Y-%m-%d",
inputEditDateFormat: "%Y-%m-%d"
Choosing 2010-09-22 in this example should produce the same output as the example in Fiddle 1 but outputs From: 2010-09-22 02:00:00+02:00. I'm not sure how to proceed from here. I suppose writing a custom fallback function for the date parsing would be an option but my guess is that I'm missing something else here.
Update 1
Based on this this github topic (mentioned in the comments), I wrote this custom inputDateParser function:
inputDateParser: function (value) {
var temp_date;
if (defaultOptions.global.useUTC) {
temp_date = moment.utc(value);
}
else {
temp_date = moment(value);
}
return temp_date.valueOf();
}
(..which requires storing the global options into a variable)
var defaultOptions = Highcharts.setOptions({
global: {
useUTC: false
}
});
Working fiddle

Tablesorter addParser for date like "aa, dd.mm.yyyy"

I try to sort dates like "Di, 29.03.2016" but this doesnt work because the Sorter doesnt have a AddParser for this format.
I know that the numbers should replace like dd/mm/yyyy,
but how should i replace "Di, " ?

Since I can't tell what language you're targeting ("Di" is the abbreviation for December in several languages), I think it might be easiest to use a date library like sugar or datejs to parse those dates for you.
Make sure to set the locale before the following code.
Sugar (demo):
Date.setLocale('es'); // Spanish
$.tablesorter.addParser({
id: 'sugar',
is: function() {
return false;
},
format: function(s) {
var date = Date.create ? Date.create(s) : s ? new Date(s) : s;
return date instanceof Date && isFinite(date) ? date.getTime() : s;
},
type: 'numeric'
});
DateJS (demo):
// make sure to load the desired locale file
// full list: https://github.com/datejs/Datejs/tree/master/build
$.tablesorter.addParser({
id: 'datejs',
is: function() {
return false;
},
format: function(s) {
var date = Date.parse ? Date.parse(s) : s ? new Date(s) : s;
return date instanceof Date && isFinite(date) ? date.getTime() : s;
},
type: 'numeric'
});
Note: The above two demos are using my fork of tablesorter & copied from this file, but these parsers will work in the original tablesorter (v2.0.5).
Note 2: There is also a parser for jQuery Globalize (demo), but it is a bit more complicated to set up and use, so I didn't include it here; and the globalize parser may not work properly with the original version of tablesorter.

Sort date in table

I want to convert string to date in Javascript. I need to do it because I have an array and create table from that. After that I want to use Tablesorter. But it sort it only like textfield. I trying to create new parser. I have string like:
"02 January 2010"
I need to create date type from that. Is it possible in Javascript? I tried
DateFormat format = new SimpleDateFormat("dd MMMM yyyy", Locale.ENGLISH);
Date date = format.parse(s);
But it doesnt work. How would I do that?

With a standard date format, you can create a date parser that doesn't need to reformat the date (demo)
$(function () {
$.tablesorter.addParser({
id: 'ddMMMMyyyy',
is: function() {
return false;
},
format: function(s) {
var date = new Date(s);
return date instanceof Date && isFinite(date) ? date.getTime() : s;
},
type: 'numeric'
});
$('table').tablesorter({
headers : {
5: { sorter: 'ddMMMMyyyy' }
}
});
});

ExtJs datefield converts invalid date to valid date

I am using ExtJS 2.1 and I have the following problem, I hate a 'datefield'. Now the date has to be entered in the format 'MM/DD/YYYY'. The problem is if the user enters something like '21/17' or '16/05' it gets converted to a valid date. (21/17 gets converted to 9/17/2015 and 16/05 gets converted to 4/05/2015). How do I override this behavior? I tried writing my own validator but that didn't help either, even if my validator returns 'false' the conversion still happens. Here is the code below:
var d = new Ext.form.DateField({
el: el.dom,
id: id,
format: 'm/d/Y',
hideTrigger: false,
allowBlank: true,
disabled: isDisabled,
validator: testForShortDate,
validateOnBlur: true,
minLength:6,
//validationEvent: false, //string or boolean
invalidText: 'Enter date as MM/DD/YYYY',
menuListeners: Ext.applyIf({
select: function (m, d) {
Ext.form.DateField.prototype.menuListeners.select.apply(this, arguments);
this.focus.defer(100, this);
onDateSelect(m, d, this);
}
})
});
d.render();
d
function testForShortDate(date) {
if (date.split("/").length != 3) {
console.log(date.split("/").length);
return false;
}
return true;
Can anyone help?

There are alternative date formats which ExtJS will try to use if the datefield's value cannot be parsed using the configured format. These formats can be defined using the altFormats property.
By default the value is:
m/d/Y|n/j/Y|n/j/y|m/j/y|n/d/y|m/j/Y|n/d/Y|m-d-y|m-d-Y|m/d|m-d|md|mdy|mdY|d|Y-m-d
which explains why something like 21/17 gets converted to 9/17/2015, as the format m/d is used here (the "21st" month of 2014 is really the 9th of 2015).
If you want to disable this altogether, just set the property to an empty string:
altFormats: ''

how to sort by date (new) with jquery isotope

Forgive me as I'm a bit novice to JS, just know enough to manipulate.
For those familiar with Isotope ( http://isotope.metafizzy.co/docs/sorting.html ), I have a button at the top of a page to sort by date. Isotope finds the element
<span class="date"> 01/04/2012 </span>
with this:
$container.isotope({
getSortData : {
date : function ( $elem ) {
return $elem.find('.date').text();
}});
Which works fine, but I need to flip (descend) the date order
Isotope has a function:
$('#container').isotope({
sortBy : 'date',
sortAscending : false
});
But I can't get it to work - that just makes the default set sort by date, rather than sorting when I click. I think this is just a question of syntax... how/where can I put sortAscending: false ??
Thanks...
EDIT Viewing some source from Demos, I see that:
<a href="#sortAscending=false">
Can be done, but I'm already sorting by passing this:
<a href="#sortBy=date">
Which finds a the span from earlier with the date info...

Here is how I did it, jsFiddle
$container.isotope({
itemSelector: '.element',
getSortData: {
date: function ($elem) {
return Date.parse($elem.find('.date').text());
}
}
});
It doesn't seem to matter what format the date is in, and works ascending and descending.
The parse() method parses a date string and returns the number of milliseconds between the date string and midnight of January 1, 1970.
Basically it turns your date strings into nice solid numbers which are easy to compare.

Heres what I did to sort by date.
If your date is in the format of '01/01/2012' then you need to convert it to a javascript date object.
getSortData: {
date: function ($elem) {
var dateStr = $elem.find('.date').text(),
dateArray = dateStr.split('/'),
year = dateArray[2],
month = dateArray[0],
day = dateArray[1];
return new Date(year, month, day);
}
}
then you do your usual
$('#container').isotope({ sortBy: 'date' });