title: Drag and drop reordering of table rows with ASP.NET MVC implementation issue
body: <p>I have an ASP.NET MVC 4 web application. On a web page, I have a HTML table presenting a number of items. </p>
  
  <p>I want to be able to implement drag and drop re-ordering for the table of items, which is saved back to the data model. </p>
  
  <p>I've looked at and tried a few different methods for doing this, using JQuery UI and some other plugins but I haven't successfully been able to implement the functionality. </p>
  
  <p>I've looked at <a href="http://www.foliotek.com/devblog/make-table-rows-sortable-using-jquery-ui-sortable/" rel="nofollow">this</a> example, but my table didn't change on running it after implementing it as follows: </p>
  
  <pre><code>        &lt;script type="text/javascript"&gt;
          $(document).ready(function()
          {
              $('#clueTable tbody').sortable().disableSelection();
          });
      &lt;/script&gt;
  </code></pre>
  
  <p>I have all the necessary javascript: </p>
  
  <pre><code>&lt;script type="text/javascript" src="~/Scripts/jquery-1.9.1.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="~/Scripts/jquery-ui-1.10.2.min.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>I'm not going to post the whole table, but it looks something like this: </p>
  
  <pre><code>        &lt;table id="clueTable" class="grid"&gt;
          &lt;thead&gt;
              &lt;tr&gt;
                  &lt;th&gt;Clue #&lt;/th&gt;
                  &lt;th&gt;Location&lt;/th&gt;
                  &lt;th&gt;Quiz Clue?&lt;/th&gt;
                  &lt;th&gt;Actions&lt;/th&gt;
              &lt;/tr&gt;
          &lt;/thead&gt;
  
          @for (int i = 0; i &lt; Model.Clues.Count; i++)
          {
              &lt;tbody&gt;
                  &lt;tr&gt;
                      &lt;td&gt;Number&lt;/td&gt;
                      &lt;td&gt;Things&lt;/td&gt;
                      &lt;td&gt;Yes&lt;/td&gt;
                      &lt;td&gt;Stuff&lt;/td&gt;
                  &lt;/tr&gt;
              &lt;/tbody&gt;
          }
      &lt;/table&gt;
  </code></pre>