Adicionar <option> dinamicamente com javaScript ?

[Videres 3]

Boa tarde pessoas,

 

Estou sentindo um pouco de dificuldade para adicionar a tag <option> dinamicamente com javaScript no meu select.... tentei alguns exemplos e n tive mto sucesso!

 

Como funcionaria?

 

 

 

Ex 1 -> <select id = "itens">

 

<select name="itens" id="itens">

 <option value = "ITEM 1"> ITEM 1</option>
<option value = "ITEM 2"> ITEM 2</option>


</select>

Ao selecionar 1 das opções acima, seria inserido no select abaixo options com valores que correspondem aos itens acima dinamicamente.

 

 

Ex 2 -> <select id ="objetos">

 

 

<select name="itens" id="objetos">
  <!-- Aqui ficaria os valores de acordo com o item selecionado acima -->


</select>

 

Por que preciso disso? Como penso em inserir os valores dos options do banco, seria interessante que ao selecionar ITEM 1, fosse adicionado no select abaixo informações do tipo Objeto 1 do item 1, Objeto 2 do item 1 e etc... adicionar ou remover um objeto de um item, ficaria a criterio do adm de conteúdo ou seja adicionando no banco apareceria, removendo do banco deixaria de ser exibido o objeto.

 

Encontrei alguns links:

http://www.guj.com.br/java/274927-criar-option-dinamicamente-como

http://www.electrictoolbox.com/jquery-add-option-select-jquery/

http://www.electrictoolbox.com/javascript-add-options-html-select/

 

 

Mas não consegui fazer funcionar... se alguem puder dar uma dica ou uma oriencao de estudo serei grato! \o

 

Espero q tenha conseguido deixar claro... caso eu consiga antes posto aqui. ABRAÇO ^~

[Henrique Barcelos 290]

:seta: http://www.daviferreira.com/posts/populando-selects-de-cidades-e-estados-com-ajax-php-e-jquery

[Videres 3]

Vlws pela força Henrique....

Mals a demora para conseguir responder... n estava conseguindo fazer com o modelo que vc sugeriu, mas seguindo a mesma linha consegui resolver, inseri alguns comentarios... espero que ajude outras pessoas:

 

 

 

//Script para ter acesso ao banco dinamicamente com ajax sem precisar de refresh na pag.
$(document).ready(function() {


//funcao ativada ao selecionar uma opcao de cursos, atraves do .change
        $("select[name=cursos]").change(function(){




//informo atraves do select disciplinas q estou carregando um conteudo do banco
$("select[name=disciplinas]").html("<option value=''>Carregando...</option>");


//Informo que estou aguardando alguma opção de disciplina ser selecionada para que possa ser exibido algo
$("select[name=assunto]").html("<option value=''>Aguardando Disciplina...</option>")


//acesso minha pag ajax, para fazer consulta no banco e exibir as disciplinas que correspondem ao curso 
//selecionado. Entre chaves passo o valor do curso selecionado.
$.post("php/ajax-disciplinas.php",{cursos:$(this).val()},




//exibo na tag select disciplinas o valor gerado atraves da minha consulta -> php/ajax-disciplinas.php
function(valor){


$("select[name=disciplinas]").html(valor);


}
)


});


//Seguindo o mesmo processo acima, ao selecionar a minha disciplina, carrego do banco asssuntos relacionados a ela.
$("select[name=disciplinas]").change(function(){


$("select[name=assunto]").html("<option vale=''>Carregando...</option>");
$.post("php/ajax-assunto.php",{disciplinas:$(this).val()},
function(valor){


$("select[name=assunto]").html(valor);


}
)

});


    });

 

 

ajax-assunto.php

 

 

<?php



/*.... CONEXAO*/

$disciplinas = $_POST["disciplinas"];

$sql = "SELECT a.* FROM disciplina d, assunto a, disciplina_has_assunto da WHERE d.id = $disciplinas AND da.assunto_id= a.id AND da.disciplina_id = d.id ORDER BY a.nome";

$result = pg_query($sql) or die ("Problema na consulta0");

if(pg_num_rows($result) == 0){
   echo  '<option value="0">'.htmlentities('Aguardando Disciplina2').'</option>';

}else{
   echo '<option value="">Selecione marca...</option>';
   while ($linhas = pg_fetch_array($result)) {
   echo "<option value='".$linhas['id']."'>".$linhas['nome']."</option>";


}
}


?>

 

ajax-disciplinas.php

 

 

<?php

/*...CONEXAO*/

//recebo o o valor da tag select cursos
$cursos = $_POST["cursos"];


$sql = "SELECT d.* FROM disciplina d, cursos c, cursos_has_disciplina cd WHERE c.id = $cursos AND cd.cursos_id=c.id AND cd.disciplina_id = d.id ORDER BY d.nome";
$result = pg_query($sql) or die ("Problema na consulta0");


//verifico quantidade de arquivos registrados no banco;
if(pg_num_rows($result) == 0){

   echo  '<option value="0">'.htmlentities('Aguardando Curso...').'</option>';

}else{

   echo '<option value="">Selecione Disciplina</option>';

   while ($linhas = pg_fetch_array($result)) {
   echo "<option value='".$linhas['id']."'>".$linhas['nome']."</option>";


}
}
?>

 

 

É isso. srsrsrsr

abraço