How To Work With Date Format In Jquery Using Moment JS ?

How to work with date format in jquery using moment JS ?

In this post we will give you information about How to work with date format in jquery using moment JS ?. Hear we will give you detail about How to work with date format in jquery using moment JS ?And how to use it also give you demo for it if it is necessary.

In this article, I will let you know how to work on date manipulation using Javascript jquery with moment library.

Date manipulation is very common process in every website and there are so many tools that you can use to change date format.

Date format can be like mm/dd/yyyy, mm-dd-yyyy, DD-MM-YYYY, yyyy-mm-dd etc.

Using Moment.js, you can easily resolve the issue for date and time format.

There are number of method available with Moment.js like you can add days to current date, subtract days or month from current date etc.

Syntax :

$(document).ready(function() {

    moment(your_string_date).format(here_date_format);

});

This was the example to change date format. Now I will show you how you can add days, subtract days to current date :

moment().add('days', 2);    // adds 2 days to current date
moment().add('months', 2);  // adds 2 months to current date
moment().add('years', 2);   // adds 2 years to current date

Same you can try subtract() method :

moment().subtract('days', 2);   // subtracts 2 days to current date
moment().subtract('months', 2); // subtracts 2 months to current date
moment().subtract('years', 2);  // subtracts 2 years to current date

<!DOCTYPE html>
<html>
<head>
	<title>How to work with date format in jquery using moment JS?</title>
	<script type="text/javascript"src="https://code.jquery.com/jquery-1.9.1.min.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.18.1/moment.min.js"></script>
</head>
<body>

<divclass="container">
  <h2>Working on date manipulation:</h2>
  <ul>
    <li>Add : <spanid="add_date"></span></li>
    <li>Subtract : <spanid="subtract_date"></span></li>

    <li>Nov 17, 2018 : <spanid="first_date"></span></li>
    <li>2018-11-17 : <spanid="second_date"></span></li>
    <li>2018/11/17 : <spanid="third_date"></span></li>
   
  </ul>
</div>

</body>

<script type="text/javascript">
  $(document).ready(function() {

    var add_day=moment().add('days', 2);
    $("#add_date").text(add_day);

    var subtract_day=moment().subtract('days', 2);  
    $("#subtract_date").text(subtract_day);


    var first_date = moment("Nov 17, 2018").format('DD-MM-YYYY');
    $("#first_date").text(first_date);


    var second_date = moment("2018-11-17").format('DD-MM-YYYY');
    $("#second_date").text(second_date);


    var third_date = moment("2018/11/17").format('DD/MM/YYYY');
    $("#third_date").text(third_date);


  });
</script>
</html>

Moment.js is really awesome library to work with date format.

Label :

HTML

jQuery

How To

Web Development

JavaScript

Moment.js

Hope this code and post will helped you for implement How to work with date format in jquery using moment JS ?. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs

For More Info See :: laravel And github

How to work with date format in jquery using moment JS ?

Label :

Leave a Comment Cancel Reply