Search code examples
javascripthtmlprototypejscopydrop-down-menu

Copying or cloning an HTML element in Prototype

I have two html select boxes where items are moved from left to right, now I want to change the behavior such that elements are copied from right to the left. I tried Oject.clone(o) and .cloneNode(true) with prototype library. It cause my browser to hang,

Presently the code that moves elements from left to right is as follows,

$('left').appendChild($('right').options.item($('right').selectedIndex));

How do I change this such that there is a copy of elements from left to right, instead of actual moving.

Solution

  • Instead of Object.clone() use Element.clone()

    var selected = $('right').options.item($('right').selectedIndex);
var copy = Element.clone(selected, true);
$('left').appendChild(copy);

    Documentation: http://api.prototypejs.org/dom/Element/clone/