on an unordered list, how do I restrict one list item from being selectable?

Question

A quick sketch of my situation is:

<ul id="selectable">
  <li class="table" id="header-row">
    <ul class="row">
      ...
    </ul>
  </li>
  <li class="table">
    <ul class="row">
      ...
    </ul>
  </li>
  ...
</ul>

How do I disable li#header-row from being selectable?

Answer 1

You can use the filter option to include (or with :not, exclude) options

$("#selectable").selectable({
    filter: ":not(#header-row)"
});

JSFiddle: http://jsfiddle.net/M7pmU/