jQuery - Add a row to a table

By jbrooksuk
in Essential Guides

 Share

Recommended Posts

Proficient

jbrooksuk

Posted
Posted

Hey,

I posted this tutorial on my blog. It describes the use of jQuery and how to add a row to a table. Hopefully this will be one in many tutorials.

Feedback would be good, I did this in 10 minutes I had free whilst working. Helped me concentrate again.

http://www.james-brooks.net/?p=281

James

Link to comment
https://www.neowin.net/forum/topic/792200-jquery-add-a-row-to-a-table/
Share on other sites
Grand Master

Kudos Veteran

Posted
  • Veteran
Posted

When hooking into anchor tags, you should be returning false to stop the default action of navigating to the location in the href, even if it's only a #.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>Add Row example</title>
<script src="dist/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
 <!-- jQuery Code will go underneath this -->
 $(document).ready(function () {	
 	// Code between here will only run when the document is ready
 	$("a[name=addRow]").click(function() {
 		// Code between here will only run when the a link is clicked and has a name of addRow
 		$("table#myTable tr:last").after('<tr><td>Row 4</td></tr>');
		return false;
 	});
 });
</script>
</head>

<body>

<table style="width: 100%" id="myTable">
 <tr><td>Row 1</td></tr>
 <tr><td>Row 2</td></tr>
 <tr><td>Row 3</td></tr>
</table>
<a href="#" name="addRow">Add Row</a>

</body>

</html>

Proficient

jbrooksuk

Posted
  • Author
Posted
When hooking into anchor tags, you should be returning false to stop the default action of navigating to the location in the href, even if it's only a #.

Yes you are correct. This is what happens when you don't have that much time.

I shall add it when my network is working again.

  • 1 year later...
Neowinian

vebjorn

Posted
Posted

Seems like your page has been moved.. Can you please update the link?

Vebj?rn

Hey,

I posted this tutorial on my blog. It describes the use of jQuery and how to add a row to a table. Hopefully this will be one in many tutorials.

Feedback would be good, I did this in 10 minutes I had free whilst working. Helped me concentrate again.

http://www.james-brooks.net/?p=281

James

This topic is now closed to further replies.
 Share
Go to topic listing

  • Recently Browsing   0 members

    • No registered users viewing this page.

  • Posts

    • Game I've been Working On

      By +pmrd · Posted

      I made a new Cinematic/Trailer for the game, this will be the intro, still a work in progress!   
    • Microsoft Opens Fairwater: Wisconsin AI Campus Runs as One Supercomputer via 800G Ethernet

      By +TRS-80 · Posted

      Closed-loop cooling and a custom 800G network protocol let the $7.3B campus run as one AI training machine. Microsoft confirmed June 23, 2026, that its Fairwater campus in Mount Pleasant, Wisconsin, is fully operational — and the engineering behind it makes the facility something fundamentally different from every data center that came before it. Where conventional cloud infrastructure racks up general-purpose servers and parcels out workloads to each one independently, Fairwater links hundreds of thousands of NVIDIA GB200 Blackwell GPUs into a single, coherent cluster using a two-story building design, 800-gigabit-per-second Ethernet fabric, and a proprietary networking protocol co-developed with OpenAI and NVIDIA. The result, according to Microsoft, is the closest thing to a purpose-built AI supercomputer that any company has ever placed in commercial operation. https://www.techtimes.com/articles/319205/20260627/microsoft-opens-fairwater-wisconsin-ai-campus-runs-one-supercomputer-via-800g-ethernet.htm  
    • The official Funny Pictures thread

      By +Edouard · Posted

    • Why it's almost impossible to produce a smartphone in the United States

      By +TRS-80 · Posted

      Last comment on this article Decades of serving as a global manufacturing hub have allowed China to build a massive talent pool in the production sector that is almost unmatched worldwide. Decades of using "forced labor" have allowed China................. UN experts alarmed by reports of forced labour of Uyghur, Tibetan and other minorities across China https://www.ohchr.org/en/press...ibetan-and-other-minorities
    • Why it's almost impossible to produce a smartphone in the United States

      By morpheus6969 · Posted

      BIG Meat Hands

  • Recent Achievements

    • Conversation Starter
      jessse3334 earned a badge
      Conversation Starter
    • Reacting Well
      JuvenileDelinquent earned a badge
      Reacting Well
    • One Month Later
      Excellence2025 earned a badge
      One Month Later
    • Week One Done
      Excellence2025 earned a badge
      Week One Done
    • Week One Done
      flexorcist earned a badge
      Week One Done

  • Popular Contributors

    1. 1
      +primortal
      505
    2. 2
      +Edouard
      207
    3. 3
      PsYcHoKiLLa
      151
    4. 4
      Steven P.
      73
    5. 5
      macoman
      62
    Show More

  • Tell a friend

    Love Neowin? Tell a friend!