[Proto-Scripty] Re: Remove an element from the DOM and add it later exactly to the same point
Thanks a lot for the helpful answers! I see that i shouldn't
underestimate the native DOM attributes/methods...
It could be interesting to add this remove/add-to-the-same-place
functionality to prototype.js. Well, i don't know if other developers
find it as helpful as i do...
/AITOR
On Feb 19, 6:55 am, RobG wrote:
> On Feb 19, 6:40 am, Aitor Garay-Romero wrote:
>
> > Hi there!
>
> > I need to remove an arbitray element from the DOM and add it later
> > exactly to the same point in the DOM. I wonder is there is a direct
> > way to achieve this. Right now i have to check wether the element has
> > a previous sibling or directly a parent and remember this information
> > to add it back.
>
> Fairly simple: remember the parentNode and nextSibling, then re-insert
> the node using parent.insertBefore(node, nextSibling). If there is no
> nextSibling, it will be null and the element will be inserted as the
> last child of the parent. Otherwise, it will use the nextSbling.
>
> e.g.
>
> function reInsert(id) {
> var el = document.getElementById('xx');
> var nextSib = el.nextSibling;
> var parent = el.parentNode;
> parent.removeChild(el);
> setTimeout( function() {
> parent.insertBefore(el, nextSib);
> }, 1000);
> }
>
> Call the function, pass it an ID. The element will be removed, then
> about 1 second later it will be put back. Modify to suit.
>
> *Do not* use Prototype.js's sibling array as it will remove text
> nodes, you certainly don't want to do that.
>
> --
> Rob
--~--~-~--~~~---~--~~
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
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] Re: Remove an element from the DOM and add it later exactly to the same point
On Feb 19, 3:55 pm, RobG wrote: [...] > *Do not* use Prototype.js's sibling array as it will remove text > nodes, you certainly don't want to do that. Not worded quite right: Prototype.js doesn't include text nodes in its sibling arrays, but they should be used in this case so use the DOM native methods. -- Rob --~--~-~--~~~---~--~~ 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 prototype-scriptaculous+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en -~--~~~~--~~--~--~---
[Proto-Scripty] Re: Remove an element from the DOM and add it later exactly to the same point
On Feb 19, 6:40 am, Aitor Garay-Romero wrote:
> Hi there!
>
> I need to remove an arbitray element from the DOM and add it later
> exactly to the same point in the DOM. I wonder is there is a direct
> way to achieve this. Right now i have to check wether the element has
> a previous sibling or directly a parent and remember this information
> to add it back.
Fairly simple: remember the parentNode and nextSibling, then re-insert
the node using parent.insertBefore(node, nextSibling). If there is no
nextSibling, it will be null and the element will be inserted as the
last child of the parent. Otherwise, it will use the nextSbling.
e.g.
function reInsert(id) {
var el = document.getElementById('xx');
var nextSib = el.nextSibling;
var parent = el.parentNode;
parent.removeChild(el);
setTimeout( function() {
parent.insertBefore(el, nextSib);
}, 1000);
}
Call the function, pass it an ID. The element will be removed, then
about 1 second later it will be put back. Modify to suit.
*Do not* use Prototype.js's sibling array as it will remove text
nodes, you certainly don't want to do that.
--
Rob
--~--~-~--~~~---~--~~
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
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
[Proto-Scripty] Re: Remove an element from the DOM and add it later exactly to the same point
Hi,
FWIW, I think you can avoid the branching.
To remember an element's position and then remove it:
* * * *
function saveAndRemoveElement(elm) {
var saved;
saved = {
elm:elm,
parent: elm.parentNode,
next: elm.nextSibling // <= May be undefined, that's okay
};
elm.remove();
return saved;
}
* * * *
To restore it:
* * * *
function restoreSavedEelement(saved) {
saved.parent.insertBefore(saved.elm, saved.next);
}
* * * *
Node#insertBefore inserts at the end of the second parameter is
undefined.
The only Prototype-ism in the above is elm.remove().
Hope this helps,
--
T.J. Crowder
tj / crowder software / com
Independent Software Engineer, consulting services available
On Feb 18, 8:40 pm, Aitor Garay-Romero wrote:
> Hi there!
>
> I need to remove an arbitray element from the DOM and add it later
> exactly to the same point in the DOM. I wonder is there is a direct
> way to achieve this. Right now i have to check wether the element has
> a previous sibling or directly a parent and remember this information
> to add it back.
>
> When i remove i do something like:
>
> var e = $( ...),
> previousSiblings = e.previousSiblings();
>
> if( previousSiblings.size() > 0) {
> this._insertPoint = previousSiblings.first(); // it has a sibling
> } else {
> this._insertPoint = e.parentNode; // no sibling, use parent as
> reference
> this._insertPointIsParent = true;
> }
>
> And to add it back:
>
> var e = $( ...);
>
> if( this._insertPointIsParent) {
> this._insertPoint.insert( { top: e});
> } else {
> this._insertPoint.insert( { after: e});
> }
>
> So, there is any direct way to do this or i have to use this
> algorithm?
>
> Thanks!
>
> /AITOR
--~--~-~--~~~---~--~~
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
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~--~~~~--~~--~--~---
