Updating a table row, jQuery

问题:

I need to update a certain row in table, already did "validators" to assure 1 row edit when checkbox is checked after clicking some other button, so far i wrote something like:

$("#btnsavechanges").click(function(){


    $("#meetingspanel tr td").find(":checked").parent().parent().children)(.eq(0).append(document.getElementById("modsub").value);
    $("#meetingspanel tr td").find(":checked").parent().parent().children)(.eq(2).append(document.getElementById("modwhere").value);
    $("#meetingspanel tr td").find(":checked").parent().parent().children)(.eq(3).append(document.getElementById("modwhen").value);
    $("#meetingspanel tr td").find(":checked").parent().parent().children)(.eq(4).append(document.getElementById("modtime").value);
    $("#meetingspanel tr td").find(":checked").parent().parent().children)(.eq(5).append(document.getElementById("modwho").value);
    $("#tblmod").fadeOut("slow");


});

The table looks like this:

<table id='tblmod' width='80%' align='center' >
<tr bgcolor='white'>
<td width='15%'>
Enter Subject<input type="text" id="modsubject" width="15%">
</td>
<td width='15%'>
Enter Location<input type="text" id="modwhere" width="15%">
</td>
<td width='15%'>
Enter When<input type="text" id="modwhen" width="15%">
</td>
<td width='15%'>
Enter Time<input type="text" id="modtime" width="15%">
</td>
<td width='15%'>
Enter With Who<input type="text" id="modwho" width="15%">
</td>
</tr>
<tr><th align="right" style=border-width:0px><button type="button" id="btnsavechanges" value="Save New Changes" >Save Changes</button></th></tr>
</table>

回答1:

I would recommend using a data-binding framework. I have been using knockoutjs recently and I like it. The amount of code I write to do complicated UIs is far smaller when using Knockout.

Basically, you would bind the HTML by just adding a data-bind property to the element. Then, when someone changes a value, it is immediately updated in your viewmodel. If you pull in new data from an AJAX request, it will update your UI too.

More info here: http://knockoutjs.com/

I strongly suggest this as it will help you write cleaner, more manageable code, and do so faster. You are going to be "reinventing the wheel" by handling everything "manually" as you are asking to do.