2

Quero copiar uma option ou mais option's selecionadas de uma select multiple para outra select multiple com jquery.

<select id='cursos' multiple>
<option selected>curso 1</option>
<option selected>curso 2</option>
<option>curso 3</option>
<option>curso 4</option>
</select>


<select id='cursosrealizados' multiple>
<option>curso 1</option>
<option>curso 2</option>
</select>

Se alguém tiver alguma ideia ou sugestão agradeço.

1
  • Fica um pouco complicado se os elementos não tem referencia, class, value ou id.
    – Markomafs
    Commented 7/10/2014 às 23:14

2 Respostas 2

3

Segue uma sugestão de implementação

JSFiddle

Se deseja copiar ao carregar a página

$(document).ready(function(){
    $('#cursosrealizados').html('');//limpa cursos realizados
    //faz loop pelas opcoes selecionads no select de cursos
    $('#cursos option:selected').each(function() {
       //clona a opcao selecionada
       var opt = $(this).clone(true).prop('selected',true);
       //coloca no select de cursos realizados
       $('#cursosrealizados').append(opt);
    });
});

Se você deseja copiar ao selecionar

$('#cursos').on('change', function(){
    $('#cursosrealizados').html('');//limpa cursos realizados
    //faz loop pelas opcoes selecionads no select de cursos
    $('#cursos option:selected').each(function() {
       //clona a opcao selecionada
       var opt = $(this).clone(true).prop('selected',true);
       //coloca no select de cursos realizados
       $('#cursosrealizados').append(opt);
    });
});
1
  • 1
    Faltou jQuery no seu código :) Só adicionaria um disabled no #cursosrealizado... Super elegante ++1
    – brasofilo
    Commented 8/10/2014 às 1:36
1

Acabei utilizando desta forma, tem base na sua resposta, só resolvi tentar simplificar:

$("#cursos option:selected" ).each(function() {  
    $("#cursosrealizados").append("<option>"+$(this).text()+"</option>");
});

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .