Elements inside hadler

[Željko Galetić]

Hi there,

I ran into a problem and would like to know is there any solution to
it.
Didnt find any similar topic here.

When using drag handler, if I have some other element inside of it, it
wont move if you grab by it.

For example:

<div id="dragbox">
<div id="dragbox_handler">
<div id="some_div">Blah Blah</div>
<div id="someother_div">Blah Blah</div>
</div>
</div>


So is there a way of making all child elements of handler to act like
a handler?


Thanx.

[3wme]

If you are using a "dragstart" function that returns false to
determine your handle element, you simply need to check the event
target more carefully.

You may find the "closest" method (new in jquery 1.3) to be quite
useful.
http://docs.jquery.com/Traversing/closest#expr

[Željko Galetić]

So yeah I am using dragstart:

.bind('dragstart',function( event ) {
return $(event.target).is('#dragbox_handler');
})

But Im quite new to jQuery... so after mush trying with "closest" I
couldnt figure it out.

Could you write for me the code upon my example?

<div id="dragbox">
<div id="dragbox_handler">
<div id="some_div">Blah Blah</div>
<div id="someother_div">Blah Blah</div>
</div>

<div id="something"><p>rest of the html</p></div>
</div>


Thanx, much appreciated.

On Oct 30, 4:20 pm, 3wme <threedubme...@gmail.com> wrote:
> If you are using a "dragstart" function that returns false to
> determine your handle element, you simply need to check the event
> target more carefully.
>
> You may find the "closest" method (new in jquery 1.3) to be quite

> useful.http://docs.jquery.com/Traversing/closest#expr

[3wme]

The "is" method returns a boolean. The "closest" method returns a
jquery object with zero or one elements, depending on whether the
selector matched or not. The dragstart handler must return a boolean
false in order to suppress the interaction... so you should convert
the "length" property of the "closest" return object to a real boolean
using a double bang...

.bind('dragstart',function( event ) {

return !!$( event.target ).closest('#dragbox_handler').length;
})

[Željko Galetić]

Yeah it works perfectly!

I should really get to learn that jQuery soon.


Big thanx for this one.

[Željko Galetić]

I actually got it just after I've posted a question! :)

The solution was to put {not : "#element"} to .bind('drag') like this:

.bind('drag',{not : "#element"},function( event ) {...}

Before Ive tried putting it inside .bind('dragstart') cause it seemed
logical to me but it didnt work.

And if I wanted to put 2 elements into it Ive done it like this:

.bind('drag',{not : "#element , #element2"},function( event ) {...}

Dont know if this all is correct, but it works.

Is there a better way? :)

[Željko Galetić]

Now I have another question.

What if I dont want for some elements to act as a handler that are
inside it?

I'll just add a line to my first example so you can see what I mean:

<div id="dragbox">
<div id="dragbox_handler">
<div id="some_div">Blah Blah</div>
<div id="someother_div">Blah Blah</div>

<div id="not_selectable_div"></div>

</div>
<div id="something"><p>rest of the html</p></div>
</div>

So I would like to have all child elements of a handler to act as a
handler except that one (or maybe even two, three) div.

I've tried using .not inside the example you gave me but no luck
(cause I dont know where exactly to put it).

So what to add to this that will solve my issue?

.bind('dragstart',function( event ) {
return !!$( event.target ).closest
('#dragbox_handler').length;
})

Thanx.

On Nov 3, 12:17 am, Željko Galetić <zeljkogale...@gmail.com> wrote: