Criar html dinamicamente não está funcionando

Ivan Saavedra · Novembro 3, 2011

Boa noite a todos. Pessoal estou fazendo TTC da faculdade, sozinho, desesperado!

Estou empacado em um ponto...vou explicar:

Estou criando um site em que tem uma página que tem um menu dentro de uma div 'a' que contem imagens(que pretendo fazer que sejam botões) que cada um desses botões deve criar dinamicamente (quando o botão for clicado) dentro de uma div 'b' específica, conteudo HTML de um formulário, por exemplo, ou campo para fazer upload de uma foto...

Um dos botões, por exemplo, deverá criar uma textarea dentro dessa div 'b' específica...e um outro botão adiciona a essa mesma div 'b' (acumulando-se a algum item anterior também criado dinamicamente) e por ai vai....

A questão é que já criei a página HTML, e em seu <HEAD></HEAD> coloquei uma função javascript para criar uma textarea (que é o primeiro botão do meu menu de opções para criar campos dinamicamente), mas ao clicar no primeiro botão, a página é recarregada, voltando ao seu inicio e quando verifico, nada foi criado!!!!

Eis o código da função que deveria criar um campo txt:

<head>

</style>

contaCampoTxt = 0; //para ser concatenado ao nome da div que conterá os campos

function criaCampoTxt()

{

//pegando o elemento ao qual serão adicionados os novos conteúdos html

corpoCapitulo = document.getElementById("corpoCapitulo");

//criando um form

form = document.createElement('form');

form.setAttribute('action','');

form.setAttribute('method','post');

form.setAttribute('name','formCampoTxt');

form.setAttribute('class','formCampoTxt');

//criando um campo de texto

textarea = document.createElement('textarea');

textarea.setAttribute('name', 'texto');

textarea.setAttribute('cols', '70');

textarea.setAttribute('rows', '5');

textarea.setAttribute('class', 'textareaCampoTxt');

//inserindo a textarea no form criado

form.appendChild(textarea);

//criando o botão submit, que neste caso é uma img

botaoSalvar = document.createElement('input');

botaoSalvar.setAttribute('name','botaoSalvar');

botaoSalvar.setAttribute('type','image');

botaoSalvar.setAttribute('src','imagens/salvar.png');

//adicionando também este botão ao form

form.appendChild(botaoSalvar);

//criando botão excluir campo adicionado dinamicamnete

botaoExcluir = document.createElement('input');

botaoExcluir.setAttribute('name','botaoExcluir');

botaoExcluir.setAttribute('type','image');

botaoExcluir.setAttribute('src','imagens/excluir.png');

botaoExcluir.setAttribute('onclik',''); //função não implementada ainda

//adicionando também este botão ao form

form.appendChild(botaoExcluir);

//criando uma div

divCampoTxt = document.createElement('div');

divCampoTxt.setAttribute('id','divCampoTxt'+ contaCampoTxt);

divCampoTxt.setAttribute('class','divCampoTxt'); // classe css já criada anteriormente

//colocando a form dentro da div criada

divCampoTxt.appendChild(form);

//adicionando a div criada ao elemento destino já existente no corpo do doc HTML.

corpoCapitulo.appendChild(divCampoTxt);

contaCampoTxt++;

}

</script>

</head>

e a parte do corpo da página HTML no qual deveria ser adicionado os campos criado dinamicamente:

A DIV DESTINO DESTE CAMPOS É A <div id="corpoCapitulo">conteudo a ser adicionado</div>

<form>

</form>

</div>

<form>

</form>

</div>

</div>

<div id="corpoCapitulo">

</div>

</div>

</div>

</div>

Caros, eu suplico ajuda pessoal.....sou iniciante, mas tenho m esforçado bastante, me ajudem!!!

Editado Novembro 3, 2011 por Ivan Saavedra

fiote · Novembro 3, 2011

1º) Use a tag [ code] pra facilitar a leitura.

2º) Falta código aí né? Você criou a função criaCampoTxt() mas não estou vendo você chamá-la em lugar nenhum.

Entrar

Criar html dinamicamente não está funcionando

Pergunta

Ivan Saavedra

Link para o comentário

Compartilhar em outros sites

1 resposta a esta questão

Posts Recomendados

fiote

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades