Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

rodrigofariat

[Resolvido] Manipulando Fomulario com JavaScript e PHP

Por , em Javascript

Recommended Posts

rodrigofariat    0

rodrigofariat
Postado

Pessoal,

 

Fiz formulário usando HTML embutido no PHP. Esse formulário retorna os nomes de aluno contidos do Banco de Dados,

e permite que o usuário através do elemeto select escolher a opção 'Nao' ou 'Sim'. O valor padrão do select é 'Nao'.

 

Esse formulário simula um cadastro de pagamento bem simples, basta o usuário escolher sim ou não.

O cadastro desse dados funcionam. Entretanto meu objetivo agora é criar um botão que ao clicar,

marque todos select exibidos com a opção 'Sim'. Fiz um código em JavaScript, mas ele seleciona só o primeiro aluno.

 

A imagem do formulário esta em : http://rodrigofariat.files.wordpress.com/2009/11/formulario-js1.gif

 

O script vem logo abaixo

 

<script language="JavaScript">
     
	
	 function MarcaSim()
	         { 
		   var nElementos = document.form.opcao.length;
		   for (i = 0; i < nElementos ; i++) 
		     {
	   	        document.getElementById("opcao").options[i].selected = true;
		     } 
			   
		 }
			
	</script>
</head>

<body>
<form name="form">

<table width=600 height=18 cellpadding=2 cellspacing=2 class="estilotabela">
<tr>
  
  <td class="estilocelula">Nome</td>
  <td class="estilocelula">Pagamento</td>
  </tr>

<?php
$conexao = mysql_connect("localhost", "root", "senha") or die ("Erro na conexao ao banco de dados.");
$db = mysql_select_db("mysql") or die ("Erro ao selecionar a base de dados.");
$sql = "SELECT * FROM cadastroclientes LIMIT 2;";
$resultado = mysql_query($sql);
$cont = 0;
 
# Dados recuperados do banco de dados

while ($linha = mysql_fetch_array($resultado))
{
    $html .= "<td><input type='text' name='nomep[]' value='{$linha['nomep']}' /></td>";
    
	$html .= "<td>";
    $html .= '<label for="opcao"></label>';
    $html .= '<SELECT name="opcao[]" id="opcao">';
    $html .= '<option>Nao</option>';
    $html .= '<option>Sim</option>';
    $html .= '</SELECT>';
    $html .= "<br>";
    $html .= "</tr>";
    $cont = $cont+1;
}

$html .= "<br><br>";
$html .= '<input type=button value="Muda para SIM" onClick="MarcaSim();"><br>';
$html .= "<br><br>";
$html .= "</form>";

print ($html);
?>

Quando clico no botao "Muda para Sim" a opção 'sim' é ativada, ms somente no primeiro aluno.

Alguma sujestao ?

 

Att,

 

Rodrigo Faria

Compartilhar este post

Link para o post
Compartilhar em outros sites

Henrique Barcelos    290

Henrique Barcelos
Postado

Isso ocorre pq você está usando ID...

 

ID é um atributo ÚNICO para um elemento. Nâo pode existir mais de um elemento com o mesmo ID.

 

Se tiver mais que um elemento com o mesmo ID e você usar o getElementById, ele retornará o primeiro encontrado.

 

Use class ou name para este fim, daí então use getElementsByClassName ou getElementsByName [recomendo este úlltimo, pois funciona no IE]...

Compartilhar este post

Link para o post
Compartilhar em outros sites

rodrigofariat    0

rodrigofariat
Postado

Consegui fazer com que o método getElementsByName manipulasse todos elementos do select.

Entretanto não consegui fazer com que o botão mudasse o valor do selects para Sim.

O que pode estar faltando ?

 

<script language="JavaScript">
	function MarcaSim(opcao)
        {  
          var arr = new Array();
          arr = document.getElementsByName("opcao[]");
          alert("Total de elementos nome do select = " + arr.length);
           
          for(var i = 0; i < arr.length; i++) {
			var  obj = document.getElementsByName("opcao[].options[i]").selected = 'Sim';
          }
		alert("Resultado = " + obj);
    }
	</script>

Att,

 

Rodrigo Faria

Compartilhar este post

Link para o post
Compartilhar em outros sites

Henrique Barcelos    290

Henrique Barcelos
Postado 

for(var i = 0; i < arr.length; i++) {
 var obj = document.getElementsByName("opcao[].options[i]").selected = 'Sim';
}

Assim não funciona msm...

 

O correto seria:

 

for(var i = 0; i < arr.length; i++) {
 var obj = document.getElementsByName("opcao[]")[i].option[0].selected = 'Sim';
}

Compartilhar este post

Link para o post
Compartilhar em outros sites

rodrigofariat    0

rodrigofariat
Postado

Mesmo com as alterações feitas, o botao não consegue colocar os dois select com a opçao Sim:

 

<script language="JavaScript">
     
	function MarcaSim()
    {  
        var arr = new Array();
        arr = document.getElementsByName("opcao[]");
        /*alert("Total de elementos nome do select = " + arr.length);*/
           
        for(var i = 0; i < arr.length; i++) 
		{
			var obj = document.getElementsByName("opcao[]")[i].option[0].selected = 'Sim';
		
        }
		alert("Resultado = " + obj);
    }
   
   
</script>

Chamada do botao no HTML:

 

 

$html .= '<input type=button value="Muda para SIM" onclick="MarcaSim();"><br>';

O que pode estar faltando ?

 

Att,

 

Rodrigo Faria

Compartilhar este post

Link para o post
Compartilhar em outros sites

Henrique Barcelos    290

Henrique Barcelos
Postado

Oops, disfarça aih...

 

Isto está errado...

for(var i = 0; i < arr.length; i++) {
 var obj = document.getElementsByName("opcao[]")[i].option[0].selected = 'Sim';
}
O correto é:

 

for(var i = 0; i < arr.length; i++) {
 var obj = document.getElementsByName("opcao[]")[i].option[0].selected = true;
}

Compartilhar este post

Link para o post
Compartilhar em outros sites

rodrigofariat    0

rodrigofariat
Postado

Pessoal,

 

Depois de ler um pouco sobre o elemento getElementsByName, criei um script bem simples.

Quando o usuário clica no botão, toda a coluna que continha "Nao" muda de valor para "Sim".

Topico resolvido !

 

<script language="Javascript">
        function MarcaSim()
		{
		   var arr = new Array(); /*Cria um vetor*/
		   arr = document.getElementsByName("opcao[]") /*Recebe elementos do vetor*/;
		   tam = arr.length; /* Obtem tamanho do vetor */
			
	          alert("Total de elementos nome do select = " + tam) /* Exibe tamanho do vetor*/
                  /* Faz o for em todo vetor, e muda todas opções para Sim */
 		  for (i=0 ; i < tam ; i++){
		     arr = document.getElementsByName("opcao[]")[i].value = "Sim" 	
		}
         }	
 </script>

 

Att,

 

Rodrigo Faria

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito