get the value of row before changing in table if cancel click
-
in my code below i can edit row success without any error but if i need to cancel value edited in row OR get value before changed what i write to cancel edit in row in table by using jquery my code as following
@{ Layout = null; } Index $(function () { $("#btn").click(function () { var x = $("#txt1").val(); var y = $("#txt2").val(); var z = $("#mycountry").val(); $("#tb").append("<tr> <td>" + x + "</td> <td>" + y + "</td> <td>" + z + "</td><td> <input type='button'class='c' value='Delete'/></td><td> <input type='button' class='d' value='Edit'/></td><td><input type='button' class='e' value='Cancel'/></td></tr>"); }); $("#tb").on("click", ".c", function () { //$(this).parent().parent().remove(); $(this).closest('tr').remove(); }); $("#tb").on("click", ".d", function () { var row = $(this).closest('tr').toggleClass("editing"); row.find("td").slice(0, 2).prop("contenteditable", row.hasClass("editing")); var myselect = '<select id="mycountr1" name="mycountry1">' + '<option>---select---</option>' + '<option>Egypt</option>' + '<option>qatar</option>' + '<option>saudia</option>' + '<option>emarates</option>' '</select>'; var dropcountry = $(this).parent().prev().prev().text; $(this).parent().prev().prev().html(myselect); //$('#tb').append(myselect); // $("#tb").children().children().eq(3).children().eq(3).append("myselect"); }); $("#btndis").on('click', function () { $("body").append("<ul id='listNames''></ul>"); $('#tb td:nth-child(2)').each(function () { $("#listNames").append("<li>" + $(this).text() + "</li>") }); }); }); .editing { background: yellow; } ID Name Country: