CODEWITHSUNDEEP
javascriptjquery
Simon
Simon

Reputation: 71

Javascript Change date format

I am implementing a date range slider.

I need to change the date format to something like 01/01/16

$(function() {
   $("#slider-range").slider({
     range: true,
     min: new Date('2010.01.01').getTime() / 1000,
     max: new Date('2014.01.01').getTime() / 1000,
     step: 86400,
     values: [new Date('2013.01.01').getTime() / 1000, new Date('2013.02.01').getTime() / 1000],
     slide: function(event, ui) {
       $("#amount").val(
         (new Date(ui.values[0] * 1000).toDateString()) 
         + " - " 
         + (new Date(ui.values[1] * 1000)).toDateString()
       );
     }
   });
   $("#amount").val(
     (new Date($("#slider-range").slider("values", 0) * 1000).toDateString()) 
     + " - " 
     + (new Date($("#slider-range").slider("values", 1) * 1000)).toDateString()
   );
});

Here is the current code : http://codepen.io/javiertrev/pen/dXYJev

Upvotes: 1

Views: 197

Answers (3)

Ankit Saxena
Ankit Saxena

Reputation: 1

Add the moment script 

  $(function() {
$("#slider-range").slider({
  range: true,
  min: new Date('2010.01.01').getTime() / 1000,
  max: new Date('2014.01.01').getTime() / 1000,
  step: 86400,
  values: [new Date('2013.01.01').getTime() / 1000, new Date('2013.02.01').getTime() / 1000],
  slide: function(event, ui) {
    $("#amount").val((new Date(ui.values[0] * 1000).toDateString()) + " - " + (new Date(ui.values[1] * 1000)).toDateString());
  }
});
$("#amount").val((new Date($("#slider-range").slider("values", 0) * 1000).toDateString()) +
  " - " + (new Date($("#slider-range").slider("values", 1) * 1000)).toDateString());
var min_date=new Date($("#slider-range").slider("values", 0) * 1000).toDateString();
 var max_date=new Date($("#slider-range").slider("values", 0) * 1000).toDateString();
min_date=moment(min_date,"ddd MMM DD YYYY").format("MM/DD/YY")
max_date=moment(max_date,"ddd MMM DD YYYY").format("MM/DD/YY")

});

Upvotes: 0

Soren
Soren

Reputation: 14688

Use a library that specifically does all this for you. Moments.js is a good choice. It does a lot more than just format dates, but extracting just the formatting examples, you can do stuff like this;

moment().format('MMMM Do YYYY, h:mm:ss a'); // July 15th 2016, 8:44:54 am
moment().format('dddd');                    // Friday
moment().format("MMM Do YY");               // Jul 15th 16
moment().format('YYYY [escaped] YYYY');     // 2016 escaped 2016
moment().format();                          // 2016-07-15T08:44:54-07:00

and

moment("12-25-1995", "MM-DD-YYYY");
moment("12-25-1995", "MM-DD-YYYY");
moment("12/25/1995", "MM-DD-YYYY");

And you can define locales for each user, so that they can pick the date formats that they use in their country as the default.

Upvotes: 0

Ruben Karapetyan
Ruben Karapetyan

Reputation: 469

try this

(new Date(ui.values[ 0 ] *1000).getDate() + "/" + (new Date(ui.values[ 0 ] *1000).getMonth() + 1) + "/" + new Date(ui.values[ 0 ] *1000).getFullYear() )

Upvotes: 1

Related Questions