How to move list items from two lists (from different areas) to one specific list by clicking the li
- by pschorr
I've been having some issues setting up a list of items and moving them between each other.
Is it possible to have multiple lists, with a link inside each item to move it to a specified list? i.e. List of actions with a plus next to the action, click the plus and move to a specified box? Furthermore, would it be possible to then load a lightbox (code would have to be inline I'd guess) from that page and move those names to the specific list as well?
Example Images
Thanks much!
More broad view of my efforts so far...
The initial issue being that I could not use listboxes due to their being rendered natively inside each individual browser. Through listboxes I was able to set this up, but with a trigger via the code below (found on stackoverflow). While it gave me partial functionality it did not get the target I was looking for.
document.getElementById('moveTrigger').onclick = function() {
var listTwo = document.getElementById('secondList');
var options = document.getElementById('firstList').getElementsByTagName('option');
while(options.length != 0) {
listTwo.appendChild(options[0]);
}
}
I then moved onto jqueryui's sortable and it's ability to connect multiple, and most important, style-able lists and to be dragged between each other. This works for the side by side tables, but it does not offer the usability I was looking for overall.
So, I've come to where I'm unsure as to where to move forward. While I can get around PHP, I wouldn't know where to start with this one personally. I'm open to any and all options!
Thanks much!
