Formatação em createElement.

[Thiago Moreira 0]

Olá pessoal,

 

Fiz uma função para criar um grupo de elementos dinamicamente com o createElement, porém eu tento colocar algum estilo css mas não funciona. As vezes até funciona no Firefox, porém no IE nunca funciona. Ja tentei colocar o estilo por id (seletor), direto na tag (style), ja tentei colocar width padrão do html, mas nenhum deles funcionam.

 

Teria alguma forma de eu colocar uma margem e largura dentro dessa função, de forma que funcione em todos os browsers?

 

Segue o código:

 

function createElementNetwork() {
	var newElement = document.createElement("div");
		newElement.innerHTML = "<label>Interface:</label>";
		newElement.innerHTML += "<input type='text' name='interfaceServidores' />";
		newElement.innerHTML += "<label>IP:</label>";
		newElement.innerHTML += "<input type='text' name='ipNetServidores' />";
		newElement.innerHTML += "<label>Máscara:</label>";
		newElement.innerHTML += "<input type='text' name='mascaraServidores' />";
		newElement.innerHTML += "<br />";
		newElement.innerHTML += "<label>Gateway:</label>";
		newElement.innerHTML += "<input type='text' name='gatewayServidores' />";
		newElement.innerHTML += "<label>DNS:</label>";
		newElement.innerHTML += "<input type='text' name='dnsNet1Servidores' />";
		newElement.innerHTML += "<label>DNS:</label>";
		newElement.innerHTML += "<input type='text' name='dnsNet2Servidores' />";
		newElement.innerHTML += "<br /><br />";
	var my_table = document.getElementById("targetNetwork");
	document.getElementById("targetNetwork").appendChild(newElement, my_table);
}

Isso é importantíssimo para mim, se puderem me ajudar, agradeceria muito!

 

 

Abraço a todos

[K M 0]

poe abaixo de var newElement = document.createElement("div");:

newElement.setAttribute("className", "NOME_DA_CLASSE");

 

 

dae você coloca no css:

 

.NOME_DA_CLASSE {

/* propriedades - div */

}

 

.NOME_DA_CLASSE label {

/* propriedades - label */

}

[Thiago Moreira 0]

poe abaixo de var newElement = document.createElement("div");:

newElement.setAttribute("className", "NOME_DA_CLASSE");

 

 

dae você coloca no css:

 

.NOME_DA_CLASSE {

/* propriedades - div */

}

 

.NOME_DA_CLASSE label {

/* propriedades - label */

}

 

Pow cara, nem rola isso tambem. Ja tentei dessa forma antes, mas só funciona no Firefox. E outra coisa: Eu precisava dar margem e largura à cada 'input' desses, para poder formatar e não ficar um em cada posição. como poderia fazer? Será que terei q mudar a função? Pode me ajudar camarada? :$

 

Abração

[K M 0]

coloca uma <div id="form"> antes do seu formulario

 

dae você pode por no css:

 

#form label { }

#form input { }

[Thiago Moreira 0]

coloca uma <div id="form"> antes do seu formulario

 

dae você pode por no css:

 

#form label { }

#form input { }

A questão é a seguinte: nenhum estilo dessa forma funciona. ja testei todas essas possibilidades. Talvez funcione usando o estilo pelo javascript, mas eu queria dar uma margem diferente à cada input... Esse é o problema.

 

Sei que talvez eu esteja sendo chato, mas é que nao estia funcionando mesmo :s Estou realmente precisando de ajuda.

 

 

Abraçao

[K M 0]

pra colocar um estilo diferente pra cada input você poe uma CLASS diferente pra cada 1, e funciona sim! :P

[Thiago Moreira 0]

coloca uma <div id="form"> antes do seu formulario

 

dae você pode por no css:

 

#form label { }

#form input { }

A questão é a seguinte: nenhum estilo dessa forma funciona. ja testei todas essas possibilidades. Talvez funcione usando o estilo pelo javascript, mas eu queria dar uma margem diferente à cada input... Esse é o problema.

 

Sei que talvez eu esteja sendo chato, mas é que nao estia funcionando mesmo :s Estou realmente precisando de ajuda.

 

 

Abraçao

[Thiago Moreira 0]

coloca uma <div id="form"> antes do seu formulario

 

dae você pode por no css:

 

#form label { }

#form input { }

A questão é a seguinte: nenhum estilo dessa forma funciona. ja testei todas essas possibilidades. Talvez funcione usando o estilo pelo javascript, mas eu queria dar uma margem diferente à cada input... Esse é o problema.

 

Sei que talvez eu esteja sendo chato, mas é que nao estia funcionando mesmo :s Estou realmente precisando de ajuda.

 

 

Abraçao

 

coloca uma <div id="form"> antes do seu formulario

 

dae você pode por no css:

 

#form label { }

#form input { }

A questão é a seguinte: nenhum estilo dessa forma funciona. ja testei todas essas possibilidades. Talvez funcione usando o estilo pelo javascript, mas eu queria dar uma margem diferente à cada input... Esse é o problema.

 

Sei que talvez eu esteja sendo chato, mas é que nao estia funcionando mesmo :s Estou realmente precisando de ajuda.

 

 

Abraçao

[K M 0]

ae man

Add Campos

 

esses elementos são criados pelo js e são estilizados como lhe falei!

[Thiago Moreira 0]

ae man

Add Campos

 

esses elementos são criados pelo js e são estilizados como lhe falei!

Pow, vou dar uma olhada neste código. Pelo que ví é exatamente o que eu testei anteriormente, mas devo ter feito algo errado. Qualquer coisa eu faço.

 

Brigadão :D

[Thiago Moreira 0]

ae man

Add Campos

 

esses elementos são criados pelo js e são estilizados como lhe falei!

Pow, vou dar uma olhada neste código. Pelo que ví é exatamente o que eu testei anteriormente, mas devo ter feito algo errado. Qualquer coisa eu faço.

 

Brigadão :D

[Thiago Moreira 0]

Show de bola. Funcionou perfeitamente!!!

 

Eu estava colocando o estilo diretamente no setAttributes, na verdade tenho q colcoar o id para fazer o estilo no css... agora funcionou :D

 

Brigadão mesmo man..

 

Abraço a todos

[K M 0]

;)