RadioButton DOM

[Leonardo Machado Moreira 0]

fala Pessoal, encrespei na construção de um radio button em DOM, que não aparece o caption do radio , aquele label que acompanha ele,, e também ele nunca aparece default, vejam

 

<script>	
			var rdGraficoPcdTempo = document.createElement('input')
			rdGraficoPcdTempo.id = 'rdGraficoPcdTempo';
			rdGraficoPcdTempo.type = 'radio';
			rdGraficoPcdTempo.checked = true;			
			rdGraficoPcdTempo.value = 'Este deveria se o primeiro radio';			
			document.body.appendChild(rdGraficoPcdTempo);	
			
			var rdGraficoPcd = document.createElement('input')
			rdGraficoPcd.id = 'rdGraficoPcd';
			rdGraficoPcd.type = 'radio';
			rdGraficoPcd.value = 'Este deveria se o segundo radio';			
			document.body.appendChild(rdGraficoPcd);	
			
	</script>

des de já agradeco

[Leonardo Machado Moreira 0]

EVOLUÇÃO

 

Ai pessoal, este código funciona nos dois sem problemas de design,, mas o negorio é o seguinte, falta só o detalhezinho que quando voce clica no radio no IE, ele nao passa a bolinha e no FF, ele marca as duas vejam,

 

//
		var ckTeste = document.createElement('input');
		ckTeste.type = 'checkbox';
		ckTeste.id = 'ckTeste';
		ckTeste.defaultChecked = true;
		document.body.appendChild(ckTeste);
		
		var lbTeste = document.createElement('label');
		lbTeste.htmlFor = 'ckTeste';
		lbTeste.innerHTML = 'Bolachas';
		document.body.appendChild(lbTeste);
		//
		var ckTeste2 = document.createElement('input');
		ckTeste2.type = 'checkbox';
		ckTeste2.id = 'ckTeste2';
		ckTeste2.defaultChecked = false;
		document.body.appendChild(ckTeste2);
		
		var lbTeste2 = document.createElement('label');
		lbTeste2.htmlFor = 'ckTeste2';
		lbTeste2.innerHTML = 'Maças';
		document.body.appendChild(lbTeste2);
		//		
		//document.getElementById('ckTeste2').checked = true;
		
		//
		var rdTeste = document.createElement('input');
		rdTeste.type = 'radio';
		rdTeste.id = 'rdTeste';
		rdTeste.defaultChecked = true;
		document.body.appendChild(rdTeste);
		
		var lbrdTeste = document.createElement('label');
		lbrdTeste.htmlFor = 'rdTeste';
		lbrdTeste.innerHTML = 'Bolachas';
		document.body.appendChild(lbrdTeste);
		//
		var rdTeste2 = document.createElement('input');
		rdTeste2.type = 'radio';
		rdTeste2.id = 'rdTeste2';
		rdTeste2.defaultChecked = false;
		document.body.appendChild(rdTeste2);
		
		var lbrdTeste2 = document.createElement('label');
		lbrdTeste2.htmlFor = 'rdTeste2';
		lbrdTeste2.innerHTML = 'Peras';
		document.body.appendChild(lbrdTeste2);
		//

falta só este finalzinho que fica belezurra

[William Bruno 1501]

Isso é em Java? oO

Cabuloso... um simples formulário em HTML não resolveria?

 

Mas tipo.. para que funcione um Radio, "passando a bolinha", todas as opções que forem da mesma "lista de opções", precisam ser declaradas com o MESMO NAME.

CORRETO:

Sim: <input type="radio" name="NomeBotao" value="sim"> 
Não: <input type="radio" name="NomeBotao" value="nao">

ERRADO:

Sim: <input type="radio" name="NomeBotao" value="sim"> 
Não: <input type="radio" name="NomeBotao2" value="nao">

[Leonardo Machado Moreira 0]

agora sim, funcionou no FF, porém no IE ta na mesma.

 

 

 

ou melhor funciona em todos (FF, Netscape, Safari, Opera), menos no IE

[William Bruno 1501]

Não manjo muito de script, mas você não declarou os NAMEs dos Radios Buttons..

Tô vendo: ID, Checked, type..

 

Por um acaso, seria algo assim?

..
rdTeste2.name = 'rdBUTTON';
e 
..
rdTeste.name = 'rdBUTTON';

[Leonardo Machado Moreira 0]

Entao, no código que eu postei nao mas depois que voce me falou eu inclui o name, ai passou a funcionar em todos os navegadores menos no IE

 

<script>

//

var ckTeste = document.createElement('input');

ckTeste.type = 'checkbox';

ckTeste.id = 'ckTeste';

ckTeste.defaultChecked = true;

document.body.appendChild(ckTeste);

 

var lbTeste = document.createElement('label');

lbTeste.htmlFor = 'ckTeste';

lbTeste.innerHTML = 'Bolachas';

document.body.appendChild(lbTeste);

//

var ckTeste2 = document.createElement('input');

ckTeste2.type = 'checkbox';

ckTeste2.id = 'ckTeste2';

ckTeste2.defaultChecked = false;

document.body.appendChild(ckTeste2);

 

var lbTeste2 = document.createElement('label');

lbTeste2.htmlFor = 'ckTeste2';

lbTeste2.innerHTML = 'Maças';

document.body.appendChild(lbTeste2);

//

//document.getElementById('ckTeste2').checked = true;

 

//

var rdTeste = document.createElement('input');

rdTeste.type = 'radio';

rdTeste.id = 'rdTeste';

rdTeste.name = 'rdTeste';

rdTeste.defaultChecked = true;

document.body.appendChild(rdTeste);

 

var lbrdTeste = document.createElement('label');

lbrdTeste.htmlFor = 'rdTeste';

lbrdTeste.innerHTML = 'Bolachas';

document.body.appendChild(lbrdTeste);

//

var rdTeste2 = document.createElement('input');

rdTeste2.type = 'radio';

rdTeste2.id = 'rdTeste2';

rdTeste2.name = 'rdTeste';

rdTeste2.defaultChecked = false;

document.body.appendChild(rdTeste2);

 

var lbrdTeste2 = document.createElement('label');

lbrdTeste2.htmlFor = 'rdTeste2';

lbrdTeste2.innerHTML = 'Peras';

document.body.appendChild(lbrdTeste2);

//

 

</script>

[brcontainer 16]

coloque a pirmeira ou todas as letras de name em maisculo

var rdTeste2 = document.createElement('input');
rdTeste2.type = "radio";
rdTeste2.id = "rdTeste2";
rdTeste2.Name = "rdTeste";
rdTeste2.defaultChecked = false;
document.body.appendChild(rdTeste2);

Ps.: não tinha de ter name aqui tambem??? assim:

var rdTeste = document.createElement('input');
rdTeste.type = "radio";
rdTeste.id = "rdTeste";
rdTeste.Name = "rdTeste";
rdTeste.defaultChecked = true;
document.body.appendChild(rdTeste);

falow abraços