title: Iterating over table with Jquery in asp.net mvc
body: <p>I asked this question before (how to create totals in an asp.net mvc view). And I think the easiest way is to just add another item to the model but I am curious about how to do the other answer which is to use Jquery.</p>
  
  <p><a href="https://stackoverflow.com/questions/7097271/showing-totals-in-an-asp-net-mvc-list-view">Showing totals in an asp.net MVC list view?</a></p>
  
  <p>And one of the answers was to iterate over the table with JQuery and create a new "totals" row.
  My jquery skills are next to non-existent (I can create a hello world in my view). Any recommendations would be great. Maybe there is a useful jquery library I should be looking at. Would be great if I could add a sort here also.</p>
  
  <p>Can someone give me an example on how this might work.</p>
  
  <p>Here is some sample asp.net MVC 2 code I want to try an work this into</p>
  
  <p>The model</p>
  
  <pre><code>namespace MvcScratch.Models
  {
      public class Thing
      {
          public string Name;
          public int Value;
  
          public Thing(string name, int value)
          {
              Name = name;
              Value = value;
          }
      }
  }
  </code></pre>
  
  <p>The Controller</p>
  
  <pre><code>public ActionResult Index()
  {
      List&lt;Thing&gt; myThings = new List&lt;Thing&gt;();
  
      myThings.Add(new Thing("Thing 1",2));
      myThings.Add(new Thing("Thing 2",3));
  
      return View(myThings);
  }
  </code></pre>
  
  <p>And the view (with a JQuery hello world).</p>
  
  <pre><code>&lt;%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage&lt;IEnumerable&lt;MvcScratch.Models.Thing&gt;&gt;" %&gt;
  
  &lt;asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server"&gt;
      Index
  &lt;/asp:Content&gt;
  
  &lt;asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server"&gt;
  &lt;script src="../../Scripts/jquery-1.4.1.min.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;script src="../../Scripts/jquery-1.4.1.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;h2&gt;Index&lt;/h2&gt;
  
      &lt;table&gt;
          &lt;tr&gt;
              &lt;th&gt;Name&lt;/th&gt;
              &lt;th&gt;Value&lt;/th&gt;
          &lt;/tr&gt;
  
      &lt;% foreach (var item in Model) { %&gt;
  
          &lt;tr&gt;
  &lt;%--            &lt;td&gt;
                  &lt;%: Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) %&gt; |
                  &lt;%: Html.ActionLink("Details", "Details", new { /* id=item.PrimaryKey */ })%&gt; |
                  &lt;%: Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })%&gt;
              &lt;/td&gt;--%&gt;
                          &lt;td&gt;
                  &lt;%: item.Name %&gt;
              &lt;/td&gt;
  
                          &lt;td&gt;
                  &lt;%: item.Value %&gt;
              &lt;/td&gt;
          &lt;/tr&gt;
  
      &lt;% } %&gt;
  
      &lt;/table&gt;
  
      &lt;p&gt;
          &lt;%: Html.ActionLink("Create New", "Create") %&gt;
      &lt;/p&gt;
  
      &lt;script type="text/javascript"&gt;
       $(document).ready(function() {
     $("h2").click(function() {
       alert("Hello world!");
     });
   });
   &lt;/script&gt;
  &lt;/asp:Content&gt;
  </code></pre>