javascript - Remove a row on uncheck -



javascript - Remove a row on uncheck -

i have table(1) checkbox against each row. when click checkbox value shown in table(2). in table(2) each row has remove option. if click remove, row removed. in same way if uncheck checkbox in table(1), corresponding row in table(2) should removed.so how should remove row on uncheck.i have placed part of code in else block.

$(document).ready(function(){ $('.isselected').click(function() { var pdtname = $(this).attr('data-productname'); if ( $('.isselected:checked').length > 0) { $("#result").show(); var table = $('<table></table>').addclass('tfoo'); var row = $('<tr></tr>').addclass('rfoo').text(pdtname); var link = $('<a href="javascript:void(0);">/a>').addclass('lfoo').text('remove'); row.append(link); table.append(row); $('#result').append(table); $("#result").on('click','.lfoo',function(){ $(this).parent().parent().remove(); }); } else { $('.isselected[data-productname="pdtname"]').on('click','.lfoo',function(){ $(this).parent().parent().remove(); }); } }); });

html

<div id="result" ></div> <td><form method='post' action='<c:url value="compareproducts.html"/>' > <input class="isselected" type="checkbox" name='id' value='${product.id}' data-productname="${product.productname}" > </form>

as per our conversation in chat. quick solution add together data-productname table when uncheck checkbox, removes table same data-productname (notice work, productname must unique).

you can see illustration on jsfiddle: http://jsfiddle.net/4g8nl9t5/1/

javascript jquery

Comments

Popular posts from this blog

Delphi change the assembly code of a running process -

json - Hibernate and Jackson (java.lang.IllegalStateException: Cannot call sendError() after the response has been committed) -

C++ 11 "class" keyword -