HTML table not updating when data changed - d3.js

Question

I'm building a chart with an accompanying table. The data for both comes from html input elements with data provided by the user. For now I'm just working on getting the table to update when the user clicks the submit button.
The first time the user clicks the submit button, the table displays correctly, however, on subsequent clicks the table is not updated, even though the underlying data is correctly updated (the global variable cashflows contains the user-entered data).
The code is shown below, but I also have a jsfiddle: http://jsfiddle.net/cyclical/xcGSu/5/
(selecting the Load Sample Data button will populate some sample data).
If the table updates correctly on the first click, doesn't that indicate that the data is bound correctly to the DOM?
Thanks,
Neil
var dollars = d3.format(",.2f");
function sampleData() {
d3.select("#cf1")[0][0].value=50000;
d3.select("#dt1")[0][0].value = "2007-05-10";
d3.select("#cf2")[0][0].value = 20000;
d3.select("#dt2")[0][0].value = "2011-01-11";
d3.select("#cf3")[0][0].value = 50000;
d3.select("#dt3")[0][0].value = "2012-07-19";
d3.select("#cf4")[0][0].value = 40000;
d3.select("#dt4")[0][0].value = "2012-08-03";
d3.select("#endMV")[0][0].value = 190551.29 ;
d3.select("#endDate")[0][0].value = "2013-09-30";
}
d3.select("#sample")
.on("click", sampleData);
var cashflows = [];
var total = 0;
var irr = 0;
// bind the cashflows array to a table for display
var column_titles = ['Date','Cashflow','Days','IRR Cashflow'];
var columns = ['date','cf','days','irr_cashflow'];
d3.select("#results").selectAll('table').data([0]).enter().append('table');
var table = d3.select('table');
table.selectAll('thead').data([0]).enter().append('thead');
var thead = table.select('thead');
table.selectAll('tbody').data([0]).enter().append('tbody');
var tbody = table.select('tbody');
table.selectAll('tfoot').data([0]).enter().append('tfoot');
var tfoot = table.select('tbody');
// append the header row
thead.append("tr")
.selectAll("th")
.data(column_titles)
.enter()
.append("th")
.attr("align", function(d) {if (d=='Date') { return "left"} else { return "right"}})
.text(function(column) { return column; });
function calculateIRR(){
cashflows = [];
var cfvalues = [];
var cfdates = [];
// get cashflows
d3.selectAll("input.cashflow")[0]
.forEach(function(d,i) {
if (d.value) {cfvalues.push( 1 * d.value )};
}
)
// get dates
d3.selectAll("input.cfdate")[0]
.forEach(function(d,i) {
if (d.value) {cfdates.push( d.value)};
}
)
// get ending MV and associated date; MV is multiplied by -1
cfvalues.push(-1 * d3.select("#endMV")[0][0].value);
cfdates.push(d3.select("#endDate")[0][0].value);
// convert date strings to date objects
var dates = cfdates.map(function(d) { return new Date(d.replace(/-/g, "/"))});
// calculate the IRR; use 5% as starting value
var rate = XIRR(cfvalues ,dates, .05);
irr = rate;
var r = d3.select("#ratedisplay").selectAll("div")
.data([rate])
.enter()
.append("div")
.attr("class","rate")
.text(function(d,i) {return "IRR: " + d}); //{return "IRR:" + dollars(d) + ""});
var len = cfvalues.length;
var last_day = dates[len -1];
// construct final cashflow array for binding
for (var i = 0; i < len; i++) {
var cf_days = moment(last_day).diff(moment(dates[i]), 'days');
var irr_cashflow = FV(rate, cf_days/365 , 0, cfvalues[i],0);
total += irr_cashflow;
cashflows.push(
{'cf': cfvalues[i], 'date': dates[i], 'days' : cf_days, 'irr_cashflow': irr_cashflow}
);
};
var rows = tbody.selectAll("tr")
.data(function(d) {return cashflows} )
.enter()
.append("tr");
var cells = rows.selectAll("td")
.data(function(row) {
return columns.map(function(column) {
return {'name': column, 'value': row[column]};
});
})
.enter()
.append("td")
.attr("align",function(d) {
if (d.name == 'date') { return "left" } else {return "right"}
})
.html(function(d) {
if (d.name == 'date') {
return d3.time.format("%Y-%m-%d")(d.value);
} else {
return dollars(d.value);
}
});
rows.exit().remove();
cells.exit().remove();
}
d3.select("#submit")
.on("click", calculateIRR);