Edit dates with a calendar (<input type="date">)

[stla]

@yihui

As we said two days ago, it would be nice to be able to edit dates with an <input type="date"> in a DT table.

I could do it but I'm not very familiar with dates in R. I think is(x, "Date") is ok to detect a date (this is the way used in lubridate). Once we get a date in this way, it remains to format it as yyyy-mm-dd in order to pass it to JavaScript. How to do that? I quickly searched on StackOverflow but all the answers I found suggest to use a package such as lubridate or anytime. Are you ok for importing a new package in DT?

[stla]

parse_date_time in lubridate is not nice because one has to know the format of the input dates. anytime::anydate is better.

[yihui]

For detecting dates, you can use inherits(x, 'Date'). Dates are automatically converted to the YYYY-mm-dd format via jsonlite. We don't need to do this by ourselves.

To support date inputs, I think we can let users specify the column indices in R:

DT/R/datatables.R

Lines 318 to 322 in 8e98367

	if (is.list(editable)) {
	editable$numeric = makeEditableNumericField(editable$numeric, data, rn)
	editable$area = makeEditableAreaField(editable$area, data, rn)
	params$editable = editable
	}

Then in JS we use <input type="date">:

DT/inst/htmlwidgets/datatables.js

Lines 831 to 837 in 6073c02

	if (inArray(index, numericCols)) {
	$input = $('<input type="number">');
	} else if (inArray(index, areaCols)) {
	$input = $('<textarea></textarea>');
	} else {
	$input = $('<input type="text">');
	}

Of course, it will be nice to automatically detect dates and use date inputs, instead of manually specifying the column indices.

Currently we know which columns are dates only when column filters are present:

DT/R/datatables.R

Lines 673 to 675 in 8e98367

	if (inherits(d, 'Date')) {
	d = as.POSIXct(d); type = 'date'
	}

DT/inst/htmlwidgets/datatables.js

Line 82 in 8e98367

var type = td.getAttribute('data-type');