Specifying multiple cancel options on jquery draggable elements

Question

As shown from the diagram above, I only want to allow users to drag the element when they click on the region indicate as "Allow dragging" all other regions do not allow dragging indicated by "disable dragging". The following is the code that i currently have. It works fine only that I am unable to pass more than one selectors to the cancel option. I have tried passing an object and space separated sector but it won't work. What am i doing wrong? Please help. ``` $(".e-note").draggable({ stop: function(e, ui) { // alert(ui.position['top']); }, cursor: 'move', opacity: 0.4, cancel: '.e-note-body', // How do i pass more than one selectors here? distance:20 }) ```

Accepted Answer

You can provide a multiple selector to combine several selectors:

```
cancel: '#selector1, .selector-two'
```

Note the comma (`,`) separating each selector inside the quotation marks.

Specifying multiple cancel options on jquery draggable elements

Solution

Problem