Dynamic table row creation

debugcn Published at Dev

fypforstack

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>. It gives an error of 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>

Javascript

<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>

user7584647

use this , you put " instead of '... and in html check row <tr> but showing 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++; 
  });

Collected from the Internet

Please contact [email protected] to delete if infringement.