1223

Insert new row in Table

I have a problem where the :eq() does not accept the counter, n, to insert values to a new column to the table in the HTML.

$(document).ready(function() { var $tablerow = $('table.table').find('tr'); count = 0; $tablerow.each(function(index, value){ count += 1; var $listitem = $(this); n = parseInt($listitem.index()); var $newRow = $("<td>" + n + "</td>"); $("table.table tr:eq(n)").append($newRow); }); });

HTML

<table class="table"> <tr><td>First row</td></tr> <tr><td>second row</td></tr> <tr><td>third row</td></tr> <tr><td>fourth row</td></tr> <tr><td>fifth row</td></tr> <tr><td>sixth row</td></tr> <tr><td>seventh row</td></tr> <tr><td>eighth row</td></tr> </table>

Answer1:

Written as-is, you're doing nothing more than writing a literal character, 'n', into .eq() method. Try this:

$("table.table tr:eq(" + n + ")").append($newRow);

Answer2:

May be try using it like previous line where you used qoutes $("table.table tr:eq(" + n + ")").append($newRow);

Answer3:

No need to index this inside $.each since as your arguments show the first one is index.

$(document).ready(function() { var $tablerow = $('table.table tr'); $tablerow.each(function(index,element){ /* "this" is current row*/ $(this).append("<td>" + index+1 + "</td>" ) }); });

Answer4:

Replace

var $newRow = $("<td>" + n + "</td>"); $("table.table tr:eq(n)").append($newRow);`

with

var $newRow = $("<td>" + (n+1) + "</td>"); $("table.table tr:eq(" + n + ")").append($newRow);

This will work

Recommend

  • How to get list of objects from BusinessEntity using myGeneration?
  • What is the correct way to update the UI in WPF from a thread dispatched from Task Factory?
  • Dataflow GroupBy -> multiple outputs based on keys
  • How to convert Linq result to Datatable (using datatable not context)
  • ASP.NET - Add/Remove TableRow dynamically in Table
  • Android center TextView horizontally while keeping left align
  • How to Add new Row Dynamically in ASP.Net MVC 5
  • Why doesn't >= (greater than or equals) comparison work in Javascript?
  • getting java.lang.ClassCastException: class java.lang.String in running a simple MapReduce Program
  • d3.js create stacked bar chart from values in object
  • How to set (Text)View attributes programmatically?
  • garbled css name when styling within UiBinder
  • How to open html table in xls on click of a button
  • Using Sax parsing to edit and write XML in VB6
  • Read a local file using javascript
  • Django: Count of Group Elements
  • PHPUnit_Framework_TestCase class is not available. Fix… - Makegood , Eclipse
  • Sending data from AppleScript to FileMaker records
  • MySQL WHERE-condition in procedure ignored
  • Rearranging Cells in UITableView Bug & Saving Changes
  • Unanticipated behavior
  • File upload with ng-file-upload throwing error
  • How to delete a row from a dynamic generate table using jquery?
  • Proper way to use connect-multiparty with express.js?
  • using HTMLImports.whenReady not working in chrome
  • Authorize attributes not working in MVC 4
  • How can I remove ASP.NET Designer.cs files?
  • python draw pie shapes with colour filled
  • EntityFramework adding new object to nested object collection
  • Is there any way to bind data to data.frame by some index?
  • costura.fody for a dll that references another dll
  • Binding checkboxes to object values in AngularJs
  • Observable and ngFor in Angular 2
  • How can i traverse a binary tree from right to left in java?
  • UserPrincipal.Current returns apppool on IIS
  • Conditional In-Line CSS for IE and Others?
  • java string with new operator and a literal
  • Net Present Value in Excel for Grouped Recurring CF
  • jQuery Masonry / Isotope and fluid images: Momentary overlap on window resize
  • How to load view controller without button in storyboard?