JSFiddle - React, Tailwind, and code Playground

by martyk

HTML

<table id="myTable"><tbody/></table>

JavaScript

/*
 * formatDate is a simple function that formats Date objects 
 * with a subset of Java simpleDateFormat patterns
 * restricted to d,dd(Day in Month); M,MM(Month in Year) and yy,yyyy(Year, full year))
 * Author: marty
*/
var formatDate = function(date, format) {
    var re = new RegExp("^" + "([dMy]+)" + "([ /\.-])" + "([dMy]+)" + "([ /\.-])" + "([dMy]+)" + "$");
    this.datepart = function(pattern) {
        var result = "";
        switch(pattern) {
            case "d": result += date.getDate(); break;
            case "dd": result += "0" + date.getDate(); break;
            case "M": result += date.getMonth() + 1; break;
            case "MM": result += "0" + (date.getMonth() + 1); break;
            case "yy": result += date.getYear(); break;                
            case "yyyy": result += date.getFullYear(); break;                
        }
        return result.substring(result.length == 3 ? 1 : 0);
    }
    this.concat = function(pattern, part0, sep0, part1, sep1, part2) {
        return datepart(part0) + sep0 + datepart(part1) + sep1 + datepart(part2);
    }
    return format.replace(re, this.concat )
};


(function($) {                // protect '$' from being overwritten by libraries != jQuery
    var dateFormat = 'd/M/yyyy';
    
    $(function() {
        var table = document.getElementById("myTable")
        var myDate = new Date();
        var month = myDate.getMonth() + 1;
        var firstOfMonth = new Date();
        firstOfMonth.setDate(1);
        for (var i = 0; i < 31; i++) {
            myDate.setDate(firstOfMonth.getDate() + i);
            if (myDate.getMonth() + 1 != month) break;
            var row = document.createElement("tr");
            var cell = document.createElement("td");
            cell.innerText = formatDate(myDate, dateFormat);
            row.appendChild(cell);
            table.tBodies[0].appendChild(row);
        }
    });
    
})(jQuery);