Adding leading zero with javascript?

Question

I need to add a leading zero to the month on the "Next day" text box for all 9 months and leave it off on 10,11,12. I haven't a clue how to achieve that.

Help!

$(document).ready(function(){

 var currentDate = new Date()
    var day = currentDate.getDate()
    if(day <= 9)
    day = '0'+day;
    var month = currentDate.getMonth() + 1
    if(month <= 9)
    month = '0'+month;
    var year = currentDate.getFullYear()
    document.getElementById("element_183").value =("" + month + "/" + day + "/" + year + "")

    function DateFromString(str){ 
        str = str.split(/\D+/);
        str = new Date(str[2],str[0]-1,(parseInt(str[1])+90));
        return MMDDYYYY(str);
    }
    
    function MMDDYYYY(str) {
        var ndateArr = str.toString().split(' ');
        var Months = 'Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec';
        return (parseInt(Months.indexOf(ndateArr[+1])/4)+1)+'/'+ndateArr[2]+'/'+ndateArr[3];
    }

    function Add90Days() {
        var date = $('#element_183').val();
        var ndate = DateFromString(date);
        return ndate;
    }

    $('#element_183').ready(function(){
        $('#element_184').val(Add90Days());
    });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
Enter date:<input type="text" id="element_183" readonly>
Next date:<input type="text" id="element_184" readonly>

@Cecilia Good catch! I was looking for dupes, but didn't know the term "Zerofilled" to search for. — krillgar, Mar 21 '17 at 17:04

score 1 · Answer 1 · edited May 23 '17 at 12:00

1

I'm going to use the technique used in this answer, so kudos to that user.

var currentDate = new Date('01/15/2017');
var currentDay = ('0' + currentDate.getDate()).slice(-2);
var currentMonth = ('0' + (currentDate.getMonth() + 1)).slice(-2);
// This is not just relevant to dates!
var number = 3;
var paddedNumber = ('0' + number).slice(-2);

// currentDay = '15'
// currentMonth = '01'
// number = '03'

What .slice(-2) does is perform a "substring", but starting from the end of the string, cutting off the front. That way, if you have a 2 digit date or month already, it will be turned into 3 characters, then that first will be removed.

edited May 23 '17 at 12:00

Community

1
1

answered Mar 21 '17 at 16:46

krillgar

12,596
6
50
86

I chose to answer this instead of marking as a dupe for a few reasons. First, the format the user was asking for is completely different than what my linked question was looking for. Second, the title of the question would result in people who are trying to solve a non-date related problem to arrive here as well. – krillgar Mar 21 '17 at 16:48
Just a note, dupes are meant to be sign posts for people searching with other search terms. If you close a question as a dupe, it will still point people who arrive here trying to solve a non-date related problem in the right direction. [Marking dupes helps future users find the right resources.](https://stackoverflow.blog/2010/11/16/dr-strangedupe-or-how-i-learned-to-stop-worrying-and-love-duplication/) – Cecilia Mar 21 '17 at 17:36
But that said, your link wasn't the best dupe anyway. :) – Cecilia Mar 21 '17 at 17:37

score 0 · Answer 2 · edited Apr 01 '19 at 07:36

I have been testing this issue and I get it work like this:

$(document).ready(function(){

 var currentDate = new Date()
    var day = currentDate.getDate()
    if(day <= 9)
    var stringDay = '0'+day.toString();
    var month = currentDate.getMonth() + 1
    if(month <= 9)
    var stringMonth = '0'+month.toString();
    var year = currentDate.getFullYear()
    document.getElementById("element_183").value =("" + stringMonth + "/" + stringDay + "/" + year + "")

    function DateFromString(str){ 
        str = str.split(/\D+/);
        str = new Date(str[2],str[0]-1,(parseInt(str[1])+90));
        return MMDDYYYY(str);
    }

    function MMDDYYYY(str) {
        var ndateArr = str.toString().split(' ');
        var Months = 'Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec';
        return (parseInt(Months.indexOf(ndateArr[+1])/4)+1)+'/'+ndateArr[2]+'/'+ndateArr[3];
    }

    function Add90Days() {
        var date = $('#element_183').val();
        var ndate = DateFromString(date);
        return ndate;
    }

    $('#element_183').ready(function(){
        $('#element_184').val(Add90Days());
    });

});

Mamun · Accepted Answer · 2017-03-22T00:45:38.770

Try the following code:

var currentDate = new Date();
//currentDate.setMonth(currentDate.getMonth() + 7);
var day = currentDate.getDate()
if(day <= 9)
day = '0'+day;
var month = currentDate.getMonth() + 1
if(month <= 9)
month = '0'+month;
var year = currentDate.getFullYear()
document.getElementById("element_183").value =("" + month + "/" + day + "/" + year + "")

function DateFromString(str){ 
  str = str.split(/\D+/);
  str = new Date(str[2],str[0]-1,(parseInt(str[1])+90));
  
  return str;
}

function MMDDYYYY(str) {
  var ndateArr = str.toString().split(' ');
  var Months = 'Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec';
  var str = new Date(str);
  
  var day = str.getDate();
  if(day <= 9)
  day = '0'+day;
  var month = str.getMonth() + 1
  if(month <= 9)
  month = '0'+month;
  var year = str.getFullYear()
  return ("" + month + "/" + day + "/" + year + "");
}

function Add90Days() {
  var date = $('#element_183').val();
  var ndate = MMDDYYYY(DateFromString(date));
  return ndate;
}

$('#element_183').ready(function(){
  $('#element_184').val(Add90Days());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Enter date:<input type="text" id="element_183" readonly>
Next date:<input type="text" id="element_184" readonly>

This works, although it doesn't roll over to the next year as it used too. The "Next date:" textbox is 90 days from the date in the "Enter date:" If you set the date to lets say 10/31/2017 it doesn't change the year to 2018. — agdm619, Mar 21 '17 at 21:37
anyway of preserving the ability of the year roll over from original code? — agdm619, Mar 21 '17 at 22:58
Hi agdm619, I have corrected the code. Please check the snippet now and let us know if anything goes wrong. — Mamun, Mar 22 '17 at 00:48
This is exactly what I was looking for!! Great work! Thanks! — agdm619, Mar 22 '17 at 14:49

Adding leading zero with javascript?

3 Answers3