Re: [Proto-Scripty] Draggables inside a droppable parent with overflow: scroll
I've seen similar problems when using scrollable divs and the drag/drop
features of Scriptaculous. It seems to be caused by the fact that
Scriptaculous's drag/drop features don't account for the scrolling of
intermediate widgets between an element's real position on the screen and
its position relative to the document.
It's discussed here a bit:
https://prototype.lighthouseapp.com/projects/8887/tickets/122-scrollbar-causes-drag-drop-to-fail#ticket-122-6
After spending some time trying to figure out where to fix this issue, I
ended up writing a couple of hackish scripts to find the REAL scrolling x/y
coordinates, even when nesting scrolling divs as follows:
function getTotalScrollLeft(n)
{
var ret = 0;
if (n.parentNode)
ret = getTotalScrollLeft(n.parentNode);
if (n.scrollLeft)
ret = ret + n.scrollLeft;
return ret;
}
function getTotalScrollTop(n)
{
var ret = 0;
if (n.parentNode)
ret = getTotalScrollTop(n.parentNode);
if (n.scrollTop)
ret = ret + n.scrollTop;
return ret;
}
On Tue, Jul 6, 2010 at 8:17 AM, Yuri Leikind yuri.leik...@gmail.com wrote:
Hello all,
I am stuck here with a problem.
There's a scrollable div on a page (overflow-y: scroll) with
draggables inside, I will call them draggables type A for the sake of
simplicity. There's a droppable area for draggables of type A.
Dragging these from inside the scrollable area works perfectly well,
and they are visible.
There are also draggables of type B in another div, and I need to
enable dropping them to the same scrollable div which contains
draggables of type A. I declare this scrollable div as a droppable for
draggables of type B, and I can drag drop them, no problem here.
But! As soon as this div is declared as a droppable area, dragging of
draggables of type A changes - they are not visible when they are
outside of their scrollable parent div, though they can be dropped.
Setting overflow to 'none' fixes the issue, but I need that scrolling.
I've been googling, but to no avail.
I tried
starteffect: function(e){
e.setStyle({'position':'absolute', 'z-index': 1001});
}
but it doesn't change anything.
What am I missing? I would appreciate any hints.
I am using Prototype 1.6.1, scriptaculous 1.8.3, testing it in Safari
5.0 and Firefox 3.6.6
Best regards,
Yuri Leikind
--
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to
prototype-scriptacul...@googlegroups.com.
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.comprototype-scriptaculous%2bunsubscr...@googlegroups.com
.
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en.
--
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptacul...@googlegroups.com.
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en.
Re: [Proto-Scripty] Re: Error with getInputs in IE 6 and IE 7
Hi TJ,
Thanks for the response. I've tried what you suggested and now am getting an
IE error message that says 'Function expected'. Any thoughts?
Thanks,
Ben
On Thu, May 13, 2010 at 12:41 PM, T.J. Crowder t...@crowdersoftware.comwrote:
Hi,
On IE, elements are not automatically extended with the Prototype
syntax sugar. You have to make sure you either get the element from
Prototype (in which case it will have processed it for you), or pass
it through $() to add the extensions. More here:
http://prototypejs.org/learn/extensions
In your case, it's the form that you need to extend, so:
var allCheckboxElements = $(document.forms[0]).getInputs('checkbox');
(I've wrapped `document.forms[0]` in the $() call.)
HTH,
--
T.J. Crowder
Independent Software Consultant
tj / crowder software / com
www.crowdersoftware.com
On May 13, 5:56 pm, Benjamin Helgeson ben.w.helge...@gmail.com
wrote:
Hi, I'm having an issue with IE 6 and 7 in which i'm getting the
following error:
Object doesn't support this property or method.
It's related to this line of code:
var allCheckboxElements = document.forms[0].getInputs('checkbox');
I get the error alert multiple times if I cut and paste this line
other places. It does work in IE 8 and in Firefox.
If anyone has any input or suggestions, I'd be appreciative.
Thanks!
Ben Helgeson
--
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to
prototype-scriptacul...@googlegroups.com.
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.comprototype-scriptaculous%2bunsubscr...@googlegroups.com
.
For more options, visit this group athttp://
groups.google.com/group/prototype-scriptaculous?hl=en.
--
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to
prototype-scriptacul...@googlegroups.com.
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.comprototype-scriptaculous%2bunsubscr...@googlegroups.com
.
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en.
--
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptacul...@googlegroups.com.
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com.
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en.
[Proto-Scripty] Checkbox toggle fails while preventing a row onclick
Hello, I've got a table in which each row has an onclick to launch a pop up using ajax. The onclick for the row is set with in the tr tag. When I attempt to prevent this row onclick while toggling the check box within the row, it fails to toggle the check box. I'm using Event.stop(event) to prevent the row onclick from running when the check box is toggled. However, doing this appears to negate the click of the check box too. I need to allow the check box to be used normally, with out launching the row onclick and to have the rest of the row use the onclick. Any help / insight on this would be much appreciated. Thanks, Benjamin FYI: As a test, I've added an alert prior to the Event.stop(). When present, this alert displays the checkbox as being toggled when the alert is given and then changes back to the original state when the alert is confirmed. -- You received this message because you are subscribed to the Google Groups Prototype script.aculo.us group. To post to this group, send email to prototype-scriptacul...@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
[Proto-Scripty] Problem with the sortable system
Hi guys,
I'm having some troubles with the sortable system.
Here's a simple example of my code :
a href=# onclick=reload();Reload/a
ul id=my_ul
li id=li_1test 1/li
li id=li_2test 2/li
/ul
script type=text/javascript
Sortable.create('my_ul', {
onChange:function(){
alert(Sortable.sequence('my_ul').join(''));
}
});
/script
When I load the page, there's no problem, I can reorder the list. But
when I'm clicking on the Reload link, there's no way I can move any
of the new li elements.
The reload(); function is quite basic:
function reload()
{
writediv('li id=li_3test 3/lili id=li_4test 4/li',
'my_ul');
}
So I guess the Sortable function only work if I'm not editing the ul
list. Is there any tips I could use to do it?
Thanks guys.
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] Re: Problem with the sortable system
I tried replacing the reload() function by :
function reload()
{
var ul= $('my_ul');
ul.update('li id=li_3test 3/lili id=li_4test 4/li');
}
without any success.
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] Re: Problem with the sortable system
Well I also tried it earlier, but I tried again and it's not working :
function reload()
{
text = file('ajax.php?action=reload');
if (text != 0)
writediv(texte, 'my_ul');
}
and the ajax.php file :
if ($_GET['action'] == 'test')
{
echo 'li id=li_3test 3/lili id=li_4test 4/li';
echo 'script type=text/javascript';
echo Sortable.create('my_ul', {
onChange:function(){
alert(Sortable.sequence('my_ul').join(''));
}
});;
echo '/script';
}
any other guesses?
--~--~-~--~~~---~--~~
You received this message because you are subscribed to the Google Groups
Prototype script.aculo.us group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
