AScyclelucraphy
New Member
I am trying to figure out the way to edit a row of table by button with jquery and jeditable. My aim is to have a "edit" button which will change desired row cells to edit mode. As per now I have:\[code\]$(document).ready(function() { $("#addrowbutton").click(function() { $("#addrow").show(); }); $("#canceladd").click(function() { $("#addrow").hide(); }); $("#saveadd").click(function() { $("#message").text("Added").fadeOut(4000, function() { $(this).css('display','block').text(""); }); $("#addrow").hide(); }); $("#add_trade_form").submit(function() { process_details(); return false; }); function process_details() { $("#add_trade_form").ajaxSubmit(); return false; } $(".editlink").click(function() { var datapos = $(this).parent().parent().prevAll().length; var editpos = datapos + 1; $("#trades_table tbody tr:eq(" + datapos + ")").hide(); $("#trades_table tbody tr:eq(" + editpos + ")").show(); }); $(".cancellink").click(function() { var editpos = $(this).parent().parent().prevAll().length; var datapos = editpos - 1; $("#trades_table tbody tr:eq(" + datapos + ")").show(); $("#trades_table tbody tr:eq(" + editpos + ")").hide(); }); $(".savelink").click(function() { var editpos = $(this).parent().parent().prevAll().length; var datapos = editpos - 1; $("#message").text("Saved...").fadeOut(4000, function() { $(this).css('display','block').text(""); }); $("#trades_table tbody tr:eq(" + datapos + ")").show(); $("#trades_table tbody tr:eq(" + editpos + ")").hide(); });});\[/code\]So:
- adding row appears and hides with a button
- edit row display and cancel as it should with values I want
- how to take the new values from the inputs and pass them to the controller (multiple id, values) ... I use MVC. <= .savelink
- how to save the new row without refreshing the page but refresh the table with the new values <= #saveadd