jQuery UI selectable - how do I exclude elements based on partial id

Question

I'm pretty new to jQuery, so this is basically a syntactical question. I'm using jQuery UI selectable and I would like to know how to exclude elements based on part of the element's id. In the example I have linked to here, I have divs with the following ids: 'TextBox1_label', 'TextBox2_label', 'TextBox3_label', 'TextBox4_label', 'TextBox5', 'TextBox6'

In my sample I have excluded 'TextBox3_label' and 'TextBox4_label' from being selectable, but what I would like to do is to exclude all of the divs that have id's end with '_label' from being selectable.

http://jsfiddle.net/4N2ja/

Answer 1

You can use the attribute contains selector:

filter: ':not(div[id*="_label"])'

However I recommend adding something else to your html that identifies the div as a label. For instance change it to:

<div id="textbox1_label" class="label">My label</div>

and filter on things that don't have the class "label".