Mientras creaba el nuevo portal en el que estoy trabajando me ví en la necesidad de tener en uno de los formularios del sitio un menú de esos que permite incluir y/o excluir elemento de un listado, los típicos con un botón de agregar hacía uno y quitar hacía otro. Seguro que no es un misterio pero después de dar unas vueltas por la red no encontré ningún script que se adaptase a mis necesidades así que decidí crear uno. Bueno parte la obtuve de un sitio el cual ahora mismo no recuerdo pero como no pedía (que yo recuerde :P) conservar la nota legal (ni tenía, que yo recuerde de nuevo :P) lo utilizé sin más y modificandolo llegué a obtener el script que presento a continuación.
El script está compuesto por un par de funciones una para añadir / agregar y otra para eliminar / excluir. Se aplica a un par de elementos select y utilizando un par de elementos cualquiera se pueden crear los botones.
El script en ejecución tendría el siguiente aspecto.
Para utilizarlo solo debemos crear el formulario, los botones y añadir las dos funciones javascript más abajo.
Lo único que deberas personalizar es la llamada a las funciones desde los botones, aquí se llaman desde el evento onClick del elemento <A> pero puedes utilizarlo de cualquier otro modo, solo debes llamar add_selected(nombreSelect1,nombreSelect2) y del_selected(nombreSelect1,nombreSelect2)
function add_selected(eout, ein){
var ob = document.getElementById(eout);
var oIn = document.getElementById(ein);
while (ob.selectedIndex != -1) {
var oSelected = ob.options[ob.selectedIndex];
var newOption = document.createElement('option');
newOption.setAttribute('value',oSelected.value);
newOption.innerHTML = oSelected.innerHTML;
oIn.appendChild(newOption);
newOption.selected = true;
ob.removeChild(oSelected);
}
}
function del_selected(eout,ein)
{
add_selected(ein,eout);
}
