I've been working on a grid control that works off of the KeyTable plug-in for Datatables. All has been going well with a few tweaks here and there, but there is one annoying issue with the plug-in. Below is the example code from the plug-in page:
$(document).ready( function () {
var keys = new KeyTable( {
"table": document.getElementById('example')
} );
/* Apply a return key event to each cell in the table */
keys.event.action( null, null, function (nCell) {
/* Block KeyTable from performing any events while jEditable is in edit mode */
keys.block = true;
/* Initialise the Editable instance for this table */
$(nCell).editable( function (sVal) {
/* Submit function (local only) - unblock KeyTable */
keys.block = false;
return sVal;
}, {
"onblur": 'submit',
"onreset": function(){
/* Unblock KeyTable, but only after this 'esc' key event has finished. Otherwise
* it will 'esc' KeyTable as well
*/
setTimeout( function () {keys.block = false;}, 0);
}
} );
/* Dispatch click event to go into edit mode - Saf 4 needs a timeout... */
setTimeout( function () { $(nCell).click(); }, 0 );
} );
} );
From what I can tell, the cell isn't made "editable" until the return key is hit, after which is now has a click event attached to it. Is there a way for me to attach a click event, in my case I want a dblclick, to the cells before I ever hit return? I've tried binding a function to the "td.focus" and and "example td" with no luck. I would like each cell to respond to a dblclick from the load, but also respond to the keys.
I added a dblclick delegate to the table cell, but the key to making this work was the last line:
$('#' + tableID).delegate('tr td.focus', 'dblclick', function () {
$(this).editable(updateURL,
{
"callback": function (value, settings) {
keys.block = false;
},
"onblur": 'submit',
"onreset": function(){
setTimeout( function () {keys.block = false;}, 0);
}
}
);
$(this).dblclick();
});
The indirect click event call using the setTimeout function that is displayed in the examples was causing the jEditable event to fire, so I got rid of it. Works with just a simple call to the click event directly.