Click table row to open editor lightbox for that entry?

emt

Hi Allan,

I'm currently using the inline controls example of Editor (http://editor.datatables.net/release/DataTables/extras/Editor/examples/inlineControls.html), and while I want to continue using that setup, I would also like to give users the option to click a table row and instantly open the editor lightbox for that entry. Is that possible?

allan

Absolutely. Just attach an event handler to the row which will call the edit method:

[code]
$('#example tbody').on( 'click', 'tr', function () {
editor.edit( this, 'Edit record', {
"label": "Update",
"fn": function () { editor.submit() }
}
} );
[/code]

Allan

emt

Thank you for the response Allan. I tried the code (and there was a missing ' ) ' to close out editor.edit), and when I click on a row, nothing pops up.

[code]
$('#example tbody').on( 'click', 'tr', function () {
editor.edit( this, 'Edit record', {
"label": "Update",
"fn": function () { editor.submit() }
})
});
[/code]

http://dcturanoinc.com/blog/contacts/

emt

Any idea on what could have been wrong with the code?

allan

Your table id is `form_results7` in your link, so you'd use that rather than `example` . Beyond that, it looks like it should work. I don't see it on your page (perhaps I'm missing it?) so I'm not entirely sure what is wrong there. Can you include it so I can see?

Allan

emt

Just updated the page to include the code now. In my previous posting of the code I should have used "form_results7", which is what I was actually using in the code. Sorry about that.

You can see the code on that page now.

allan

Ah! The tbody element doesn't exist until it is created by DataTables since you don't have one in the table to start with. Just put that code after the DataTables initialisation and it will work no problem. Or change to be:

[code]
$('#example').on( 'click', 'tbody tr', function () {
[/code]

that also will work.

Allan

emt

That did it, thank you so much Allan :)