editable td

from stackoverfow

by J. Jones

HTML

<table id="tree">
    <tr id="foo-1">
        <td contenteditable="true">fooId1</td>
        <td contenteditable="true">fooName1</td>
        <td>fooCsv1</td>
        <td>
            <button id="button-1" type="button" disabled>Save</button>
        </td>
    </tr>
    <tr id="foo-2">
        <td>fooId2</td>
        <td>fooName2</td>
        <td>fooCsv2</td>
        <td>
            <button id="button-2" type="button" disabled>Save</button>
        </td>
    </tr>
</table>

JavaScript

$('td[contenteditable=true]').blur(function () {
    $(this).parent('tr').find('button').removeAttr('disabled');

});
$('button').click(function () {
    var contents = $(this).parents().find('td[contenteditable=true]');
    var contentArray = [];
    for (i = 0; i < contents.length; i++) {
        contentArray[i] = contents[i];
    }
    console.log(contentArray);
    $.post("test.php", contentArray);
});