I am using jQuery 1.3.2, with jQueryUI 1.7.2
I am building a page that will have multiple similar regions with drag
and drop. I want each region to have a different d'n'd scope - that of
its containing div e.g. The only differences in the standardised code
within the dragAndDropRegion div will be textual and layout
positioning.
<div class="area1">
<div class="dragAndDropRegion">
... standardised drag and drop stuff here
</div>
</div>
<div class="area2">
<div class="dragAndDropRegion">
... standardised drag and drop stuff here
</div>
</div>
I am using jQuery drag and drop code as per the tutotials and if I
just had a single scope it would all be OK. But I want to use scope to
prevent draggables from area2 dropping into area 1 and vice versa.
(Actually there will be quite a few of these areas). That means I have
to set scope of each draggable and droppable div within the
dragAndDropRegion div explicitly outside the initialiser.
My code to set the scope for each area looks like this:
$(function()
{
$(".dragClass1 .dragClass2").draggable(
{
... code to configure draggables
});
$(".dropClass1 .dropClass2").droppable(
{
... code to configure droppables
}
$(".dragAndDropRegion").each(function(index)
{
var currArea = $(this).parent().attr("className");
$(this).find(".dragClass1 .dragClass2").draggable('option',
'scope',
currArea);
$(this).find(".dropClass1 .dropClass2").droppable('option',
'scope',
currArea);
});
});
When I place the block with the each function after the draggable and
droppable initiations, the drag and drop ceases to work and gives the
jQuery error:
m is undefined in jquery-ui-1.7.2-custom.js at line 1490
This is the line in that file:
droppablesLoop: for (var i = 0; i < m.length; i++) {
I have tried placing alerts after the setter methods, and they show -
using the appropriate getters - that scope has been set as expected.
A couple of bits of extra info:
+ Even if I set all scopes to "testScope" rather than the currArea
variable scope this code still breaks the drag and drop
+ If I use this code to set scope of only the draggables to
"testScope" and hard-code the scope of all droppables to "testScope"
in their initialisers, all is well. It only seems to be setting scope
of the droppables that is the problem.
Does anyone have any ideas? I am quite new to jQuery so there could be
better ways of doing this that I am missing.
Thanks.
--
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to jquery...@googlegroups.com.
To unsubscribe from this group, send email to
jquery-ui+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en.
