title: Sortable: disable a column in a sortable row
body: <p>I've a html table with 4 columns and few rows. The rows need to be sortable (I am using jquery ui sortable), however the outer left
  td should never move. So basically I'd like to be able to move the row without moving the outer left td in that row.
  I've tried to mess around with items option and cancel method with no success.
  I looked up similar threads but my aim is not to make every td sortable:</p>
  
  <p><a href="https://stackoverflow.com/questions/16151800/jquery-sortable-with-multiple-tbody">jquery sortable with multiple tbody</a></p>
  
  <p><a href="https://stackoverflow.com/questions/14069435/how-to-make-a-single-td-element-in-a-tr-not-sortable-jquery-ui">How to make a single &lt;td&gt; element in a &lt;tr&gt; not sortable (jquery ui)</a></p>
  
  <p>Is this doable using sortable?
  If someone could point me in the right direction I would appreciate it a lot.</p>
  
  <p>My mark up:</p>
  
  <pre><code>&lt;table&gt;
      &lt;tr class="head_row"&gt;
      &lt;td&gt;Counter&lt;/td&gt;
          &lt;td&gt;Position&lt;/td&gt;
          &lt;td&gt;Note&lt;/td&gt;
          &lt;td&gt;Visible&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tbody class="sort"&gt;
          &lt;tr&gt;
              &lt;td&gt;1&lt;/td&gt;
              &lt;td&gt;1&lt;/td&gt;
              &lt;td&gt;TEST1&lt;/td&gt;
              &lt;td&gt;Y&lt;/td&gt;
       &lt;/tr&gt;
       &lt;tr&gt;
              &lt;td&gt;2&lt;/td&gt;
              &lt;td&gt;1&lt;/td&gt;
              &lt;td&gt;TEST2&lt;/td&gt;
              &lt;td&gt;Y&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
              &lt;td&gt;3&lt;/td&gt;
              &lt;td&gt;1&lt;/td&gt;
              &lt;td&gt;TEST3&lt;/td&gt;
              &lt;td&gt;Y&lt;/td&gt;
     &lt;/tr&gt;
  
     &lt;/tbody&gt;
  </code></pre>
  
  <p></p>
  
  <p>jquery:</p>
  
  <pre><code>$(function(){
      $(".sort").sortable({
          helper: fixWidth,
          revert : true,
          cursor: "move",
          opacity: 0.5
      });
  });
  
  
  // fixes the width of the table rows while sorting
      var fixWidth = function(e, tr) {
          var $originals = tr.children();
          var $helper = tr.clone();
          $helper.children().each(function(index)
          {
            $(this).width($originals.eq(index).width())
          });
          return $helper;
      };
  </code></pre>
  
  <p>Here's a link to what I have so far:</p>
  
  <p><code>http://jsfiddle.net/zSzks/2/</code></p>
  
  <p>The "counter" column shouldn't move in this case.</p>
  
  <p>Thank you,
  Monika</p>