DUVIDA:novo inptTextField sem precisar reinderizar novamente a páginia

Assuntos Gerais
#1

Olá pessoal …
Estou com o seguinte peoblema…
preciso clicar em um link, e a ação do link será gerar um novo inptTextField sem precisar reinderizar novamente a páginia…parecido com o link “anexar um arquivo” do gmail(ver img abaixo)

Ou seja, a cada vez que você clicar no link “anexar outro arquivo” aparece um novo inputextfield…
O problema é que não sei como fazer isso…acho importante citar que em meu projeto uso jsf e facelets…

caso alguem possa me ajudar( me indicando algum framework, que faça isso)…Obrigado…!!! 8)

#2

o truque aí é que existe uma div escondida, que só fica visível quando você clica no link.
da pra fazer isso com javascript e DOM bem fácil…

por exempĺo:

<script>
   function mostrarDiv() {
      document.getElementById('divAnexarArquivo').style.display = '';
   }
</script>

<a href="#" onclick="mostrarDiv()">Anexar Arquivo</a>
<div id="divAnexarArquivo" style="display: none;"><input type="text" name="upload"/></div>

o basicão é isso, mas dá pra fazer muito mais coisas

#3

[quote=andreiribas]o truque aí é que existe uma div escondida, que só fica visível quando você clica no link.
da pra fazer isso com javascript e DOM bem fácil…

por exempĺo:

<script>
   function mostrarDiv() {
      document.getElementById('divAnexarArquivo').style.display = '';
   }
</script>

<a href="#" onclick="mostrarDiv()">Anexar Arquivo</a>
<div id="divAnexarArquivo" style="display: none;"><input type="text" name="upload"/></div>

o basicão é isso, mas dá pra fazer muito mais coisas[/quote]

Na verdade não é bem isso, porque se assim fosse haveria um limite na quantidade de arquivos que podem ser anexados (igual á quantidade de

escondidos.
O que eles fazem é criar um novo a cada vez que se clica no botão, mais ou menos como descrito abaixo: 
var input = document.createElement('input');
document.getElementById('id_do_seu_div').appendChild(input);
#4