jquery - How to solve the overlapping when appending number with two table or element? -
when click on button both table randomly,the number not following sequence on own table.this main issue on question.thank. html code:
<table width="600px" id="project"> <tr> <td>1</td> <td><textarea name="pro_1" cols="100" rows="2"></textarea></td> </tr> <tr> <td>2</td> <td><textarea name="pro_2" cols="100" rows="2"></textarea></td> </tr> <tr> <td>3</td> <td><textarea name="pro_3" cols="100" rows="2"></textarea></td> </tr> <tr> <td>4</td> <td><textarea name="pro_4" cols="100" rows="2"></textarea></td> </tr> <tr> <td>5</td> <td><textarea name="pro_5" cols="100" rows="2"></textarea></td> </tr> </table> <input id="addbtn" type="button" name="addbtn" value="add">
this jquery code:
$(document).ready(function() { $("#addbtn").click(function(){ var num=parseint($("#project tr:last").text()); num+=1; $("#project,textarea").append("<tr><td>"+num+"</td><td><textarea cols='100' rows='2'></textarea></td></tr>"); }); $("#pub_addbtn").click(function(){ var val=parseint($("#pub tr:last").text()); val+=1; $("#pub,textarea").append("<tr><td>"+val+"</td><td><textarea cols='100' rows='2'></textarea></td></tr>"); });
});
sorry table here:
<table width="600px" id="pub"> <tr> <td>1</td> <td><textarea name="pub_1" cols="100" rows="2"></textarea></td> </tr> <tr> <td>2</td> <td><textarea name="pub_2" cols="100" rows="2"></textarea></td> </tr> <tr> <td>3</td> <td><textarea name="pub_3" cols="100" rows="2"></textarea></td> </tr> <tr> <td>4</td> <td><textarea name="pub_4" cols="100" rows="2"></textarea></td> </tr> <tr> <td>5</td> <td><textarea name="pub_5" cols="100" rows="2"></textarea></td> </tr> </table> <input type="button" name="pub_addbtn" value="add" id="pub_addbtn">
just use index()... , have fixed of selectors. http://jsfiddle.net/yhkrt/
assuming have 2 tables , 2 buttons there issues code caused issue. code fixes it.
$("#addbtn").click(function () { var num = parseint($("#project tr:last").index()) + 1; num += 1; $("#project").append("<tr><td>" + num + "</td><td><textarea cols='100' rows='2'></textarea></td></tr>"); }); $("#pub_addbtn").click(function () { var val = parseint($("#pub tr:last").index()) + 1; val += 1; $("#pub").append("<tr><td>" + val + "</td><td><textarea cols='100' rows='2'></textarea></td></tr>"); });
Comments
Post a Comment