Dojo Data Grid – Part 22: Using a Date Picker in an Editable Column
Plain text, checkbox, and drop-down list are the options built into the dojo data grid control for editable column field types. In this post, I’ll show how you can use a date picker to edit a column in Notes 9.
Dojo Data Grid Series
There are two steps required to make this work.
1) Add the dojox.grid.cells.dijit module to the XPage. (Resources > Add > Dojo Module…)
2) Set a date column’s editable property to true and enter dojox.grid.cells.DateTextBox in the column’s cellType property. (You’ll have to type it in directly — it’s not an option in the list.)
Only Works in Notes 9
This feature was only mentioned in the Dojo DataGrid documentation as of version 1.7. Notes 8.5.3 uses dojo 1.6, so it doesn’t work properly there. It will display the date picker and even display the updated date value in the cell after it’s edited, but it fails when saving the updates.
Formatting the Date Column
Of course, you’re generally not going to leave your dates in this format, because they’re tough to read. In the documentation there is information about column-formatting functions for date fields.
These functions seem to initially work fine for the columns in R9 (it requires overriding he date text box’s default function to return a value, which can be done onclientload). However, when the column value is edited and a new date is selected, it’s no longer in the original format, so it doesn’t get re-formatted properly and the column appears to be blank (and an error about retrieving a date object is thrown quietly). The good news is that the value is still saved properly, so it’s still working in that case.
I tried to tweak the code to trap for that date error and just return the value as is in that case, but I haven’t had success with it yet.
The formatting functions supplied in the documentation work perfectly fine for a straight Dojo DataGrid implementation (i.e. not using the Dojo Data Grid control). The grid control just can’t implement them in the same way because there’s neither a getValue property to attach to a column nor a property to attach dojo attributes.