CODEWITHSUNDEEP
jqueryjquery-ui
user789122
user789122

Reputation: 480

Custom selection of items for jQuery-UI:Selectable

I have a main div, with sub divs inside:

<div id="selectable">
  <div class="item text"></div>
  <div class="item image"></div>
  <div class="item text"></div>
</div>

When I add the jQuery of: 

$('#selectable').selectable();

All of the divs inside are thus selectable.

Is there a way to remove the selectable class on the div that has a class with 'image'?

Thanks

Upvotes: 0

Views: 301

Answers (6)

kidwon
kidwon

Reputation: 4524

If you want custom selection that is your syntax streight from the UI api

$( "#selectable" ).selectable({ filter: 'div:not(.image)' });

Check it out: http://jsfiddle.net/bBBER/8/

You can be even more spesific 

$( "#selectable" ).selectable({ filter: 'div.item:not(.image)' });

http://jsfiddle.net/bBBER/9/

Upvotes: 2

Aleksandr M
Aleksandr M

Reputation: 24406

Use :not selector to exclude elements with image class

$('#selectable').children("div:not(.image)").selectable();

Upvotes: 0

Ankush Jain
Ankush Jain

Reputation: 1527

try the following

  $('div.image').removeClass('selectable');

Upvotes: 0

LoSTxMiND
LoSTxMiND

Reputation: 332

You can iterate on each element and then avoid those with class image. Like :

$('#selectable').each(function(div) {
 if (!$(this).hasClass('image'))
   {
     $(this).selectable();
   }
});

Upvotes: 0

benbyford
benbyford

Reputation: 649

I imagine not as the parent div is selectable and thus everything contained will inherently be selected as they are children of that div. You could simply take some elements out of the selectable div?

Upvotes: -1

Jan Hančič
Jan Hančič

Reputation: 53929

Try this:

$( '#selectable > div:not(.image)' ).selectable ();

This selector will select all child divs of #selectable that don't have the image class.

Upvotes: 5

Related Questions