javascript add number of input fields equal to the number of months

Question

I have two input fields with date1 and date2.Below this two fields i need a button that when i press it, will create a number of input fields equal to the number of months between the 2 date fields. For example i have date1=2012-03-21 and dat2=2012-06-21. It should generate 3 input fields Can you help me with this one?

Answer 1

Let's assume the HTML looks something like this:

<div id="dateRange">
    <input type="text" id="startDate">
    <input type="text" id="endDate">
</div>
<div id="monthlyEntries"/>

Now, a month is not a uniform number of days ("30 days has September, April, June,and November..."), so I'm guessing the day portion of the dates don't matter.

Then, the javascript to call on change (or clicking a button, or whatever), would look something like this:

function buildMonthlyEntries() {
    var startDate = new Date(document.getElementById('startDate').value);
    var endDate = new Date(document.getElementById('endDate').value);
    if(startDate == "Invalid Date" || endDate == "Invalid Date") { return null; }
    var entryCount = (endDate.getMonth() + endDate.getFullYear()*12) - (startDate.getMonth() + startDate.getFullYear()*12);
    var monthlyEntries = document.getElementById('monthlyEntries');
    monthlyEntries.innerHTML = "";
    for(var i = 0; i < entryCount; i++) {
        var textElement = document.createElement('input');
        textElement.setAttribute('type', 'text');
        textElement.setAttribute('id', 'entry' + i);
        monthlyEntries.appendChild(textElement);
    }
    return null;
}

Answer 2

You can run a loop based upon the difference in the dates. In pseudo code it would be something like

var difference = month2 - month1;

for(x=0;x<difference,x++){
     add inputfield;
}