jquery сделать строку таблицы редактируемой при нажатии и опубликовать значение при нажатии Enter

Question

HTML

<table>
<tr><th>Name</th><th>etc</th><th>tds</th><th>notes</th></tr>
<tr><td></td><td></td><td></td><td></td></tr>
</table>

JS

$('td').click(function(){
    var input = $('<input/>').attr('value',$(this).text());
    var w = $(this).innerWidth();
    input.css('width',w).css('border','0');
    $(this).empty();
    $(this).append(input);
    input.focusout(function(){$(this).parent().text($(this).val());});
    input.focus();
});

У меня есть эта простая таблица, и я хочу, чтобы пользователь заполнял таблицу. пользователь должен нажать на td, чтобы ввести значение, и после того, как он заполнит все 4 поля и нажать ENTER, строка, которую он заполнил, будет отправлена ​​на сервер и перезагрузите таблицу.

чтобы сделать это, я думал, чтобы пользователь $(this).closest('table').load('tbl.php',{VALUES OF THE TD's in that row});

С помощью tbl.php сохраните строку в базу данных и перезагрузите таблицу из базы данных.

Моя проблема

1. Как выбрать значения тд и отправить в.load()
2. Как вызвать это событие, когда пользователь нажимает клавишу ввода

большое спасибо