[英]Dynamic table row creation
I am trying to insert a dynamic row in a table. 我正在尝试在表中插入动态行。 Apparently, I was able to add input rows but I am unable to add a new row for button
<td class="text-center"><a class='btn btn-info btn-xs' href="#"><span class="glyphicon glyphicon-edit"></span> Select</a> </td>
. 显然,我能够添加输入行,但无法为按钮
<td class="text-center"><a class='btn btn-info btn-xs' href="#"><span class="glyphicon glyphicon-edit"></span> Select</a> </td>
。 It gives an error of Uncaught SyntaxError: missing ) after argument list
Uncaught SyntaxError: missing ) after argument list
给出Uncaught SyntaxError: missing ) after argument list
错误Uncaught SyntaxError: missing ) after argument list
<table id="tab_logic" class="table table-bordered table-striped display nowrap" cellspacing="3" width="100%">
<br>
<thead>
tr>
<th>Name</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr id='addr0'>
<td>1
</td>
<td class="text-center"><a class='btn btn-info btn-xs' href="#"><span class="glyphicon glyphicon-edit"></span> Select</a> </td>
</tr>
<tr id='addr1'></tr>
</tbody>
<tfoot>
</tfoot>
</table>
<script type="text/javascript">
$(document).ready(function(){
var i=1;
$("#add_row").click(function(){
$('#addr'+i).html("<td>"+ (i+1) +"</td><td><input name='name"+i+"' type='text' placeholder='Name' class='form-control input-md' /> </td> <td class="text-center"><a class='btn btn-info btn-xs' href="#"><span class="glyphicon glyphicon-edit"></span> Select</a> </td>");
$('#tab_logic').append('<tr id="addr'+(i+1)+'"></tr>');
i++;
});
});
</script>
use this , you put " instead of '... and in html check row <tr>
but showing tr> 使用这个,你把“而不是'...”放到html中,并在
<tr>
行中显示tr>
var i=1;
$("#add_row").click(function(){
$('#addr'+i).html("<td>"+ (i+1) +"</td><td><input name='name"+i+"' type='text' placeholder='Name' class='form-control input-md' /> </td> <td class='text-center'><a class='btn btn-info btn-xs' ><span class='glyphicon glyphicon-edit'></span> Select</a> </td>");
$('#tab_logic').append('<tr id="addr'+(i+1)+'"></tr>');
i++;
});
Try to keep your "
and '
clean. You have a lot of them mixed up 尝试保持您的
"
和'
干净。您将它们混合在一起
var i = 1; $('#add_row').click( function(){ $('#addr'+i).html('<td>' + (i+1) + '</td><td class="text-center"><a class="btn btn-info btn-xs" href="#"><span class="glyphicon glyphicon-edit"></span>Select</a></td>'); $('#tab_logic').append('<tr id="addr'+(i+1)+'"></tr>'); i++; });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table id="tab_logic" class="table table-bordered table-striped display nowrap" cellspacing="3" width="100%"> <thead> <tr> <th>Name</th> <th>Action</th> </tr> </thead> <tbody> <tr id='addr0'> <td>1 </td> <td class="text-center"><a class="btn btn-info btn-xs" href="#"><span class="glyphicon glyphicon-edit"></span> Select</a> </td> </tr> <tr id="addr1"></tr> </tbody> <tfoot> </tfoot> </table> <button id="add_row">Add Row</button>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.