[Resolvido] Adicionar selects automaticamente

[deathrash 0]

Boa tarde pessoal, sou novo no fórum

 

Tenho um sistema web que faz controle de produção. No momento estou cuidando da parte de cadastro de produtos. Neste caso, se faz o cadastro do produto (Código, Nome, Descrição, etc) e também, em alguns casos, deve-se colocar os insumos ("sub-produtos") que compõe esse produto. Para isso, deve-se ter uma caixa combo com os sub-produtos para o operador escolher e do lado uma caixa de texto pequena com a quantidade desse produto. Estava pensando em uma interação do seguinte modo: primeiro criar um button para a pessoa clicar caso precise adicionar sub-produtos, assim aparecendo uma caixa combo e caixa de texto. A pessoa preenche esse campo e ao terminar preencher (ou clicando em um ícone de "+" ao lado), apareça outra caixa combo e texto, assim sucessivamente, em quantos sub-produtos forem necessários. Alguém poderia me ajudar? Tenho pouca noção em JavaScript.

 

Obrigado por enquanto

Alexandre

 

EDIT: Vai uma informação importante, os dados da caixa combo são "puxados" de um banco de dados.

[Gabriel Heming 766]

Você pode usar ajax, recomendo utilizar a biblioteca jQuery. Ajax dela é bem simples de usar.

 

toda vez que o usuário clicar para adicionar um campo, ele carrega uma página em php contendo somente o form select adicionando ao local que já existe os outros form select.

 

não tenho código pronto, mas posso dar um pequeno exemplo:

 

suponha que este é um bloco dentro do seu formulário, nesse bloco, conterá somente os select's dos subprodutos

<div id="subprodutos">
  <select name="subproduto[]" >
     <option value="0">---selecione---</option>
     <option value="1">SubProduto 1</option>
     <option value="2">SubProduto 2</option>
  </select>
</div>

 

você terá uma página em php para consultar no banco e criar somente o select, deste modo

Não entrarei em detalhes de consulta no banco.

<?php 
$consulta = mysql_query( 'select * from subprodutos' );
?>
<select name="subproduto[]" >
  <option value="0">---selecione---</option>
<?php
  while( $subproduto = mysql_fetch_array( $consulta ) ) {
     echo '<option value="'.$subproduto['id'].'">'.$subproduto['descricao'].'</option>';
  }
?>
</select>

 

e mais um arquivo javascript com o ajax para incluir a sua página ao conteúdo existente da div.

 

Estou procurando algum exemplo prático, mas ta ruim de achar '-'

[deathrash 0]

Você pode usar ajax, recomendo utilizar a biblioteca jQuery. Ajax dela é bem simples de usar.

 

[...]

 

Vou pesquisar sobre essa biblioteca e como implementá-la ao meu caso. Usando esse modo eu conseguiria criar os selects sem precisar de fazer um refresh? (só para saber se terei que repôr os valores já digitados no formulário)

 

EDIT: Acabei de descobrir que sim.

[gremio10 14]

Não é necessário colocar

name="subproduto[]"

por que criar um array se tu sabe que só será escolhido uma opção, se for simples a escolha, é claro.

 

faça com jQuery, mande ele buscar todos os valores, trabalhe com JSON, e com isso você conseguirá agilizar a consulta e a construção dos options.

[deathrash 0]

Não é necessário colocar

name="subproduto[]"

por que criar um array se tu sabe que só será escolhido uma opção, se for simples a escolha, é claro.

 

faça com jQuery, mande ele buscar todos os valores, trabalhe com JSON, e com isso você conseguirá agilizar a consulta e a construção dos options.

 

Na verdade, um produto é composto por 0 ou N sub-produtos.

Agradeço a indicação do Jquery, parece ser mesmo a melhor ferramenta para isso.

Achei uma vídeo aula interessante sobre exatamente o que estou precisando, só que esta não coleta dados de um banco em uma caixa combo.

 

 

Aos poucos estou implementando e espero não ter dificuldades em pegar dados do banco, caso tenha volto a postar. Obrigado por enquanto

[Gabriel Heming 766]

A função que eu mais utilizo da jQuery é a jQuery.load();

 

funciona assim:

<script type="javascript/text" >
  ('#idDoBloco').load( 'subproduto.php' );
</script>

 

 

Nada mais faz que inserir o conteudo do arquivo subproduto.php dentro do bloco com id idDoBloco

Porém, utilizando assim, ele remove todo conteudo do bloco, estava procurando como não remover esse conteudo, para fazer isso eu utilizava outra biblioteca, mas ela entra em conflito com a jQuery, e sou meio leigo em jQuery ainda para saber das funcionalidades '-'

[deathrash 0]

Com um pouco de trabalho consegui fazer o que queria. Além disso, o jQuery me deu capacidade de melhorar várias outras coisas.

 

Obrigado, podem fechar o tópico.