Ir para conteúdo

POWERED BY:

Arquivado

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

kamipress

[Resolvido] troca de informações dentro de menu-list

Por , em Javascript

Recommended Posts

kamipress    0

kamipress
Postado

Boa tarde a todos,

 

Esse é meu primeiro post, peço perdão caso esteja fazendo algo de errado.

 

Senhores, eis meu caso:

 

Tenho um formulário em PHP:

http://www.rothaturismo.com.br/includes/ccontato.php

Meu cliente me pediu para alterar os pontos de embarque para cada destino (São Paulo, tem seus pontos de embarque e Paraguai tem outros).

 

Montei toda a estrutura e inseri um javascript simples para alternar as informações conforme código abaixo.

 


<html>
<head>
<title> Faça sua reserva</title>
<link href="../estilos.css" rel="stylesheet" type="text/css" />
<link href="estilos.css" rel="stylesheet" type="text/css" />
</head>

<body>
<?php include ('header.php');?>
<div id="corpo">
<div id="links">
	<a id="botao" href="index.php?link=home">Home</a>
	<a id="botao" href="index.php?link=sao_paulo">São Paulo</a>
	<a id="botao" href="index.php?link=paraguai">Paraguai</a>
	<a id="botao" href="index.php?link=dicas">Informações</a>
</div>

<form id="form1" name="form1" method="post" action="enviar_contato.php">	
<div id="dados">
	<div id="form_titulo">
		DADOS PESSOAIS
	</div>
	<div id="dados_form">
		<input name="nome" value="Nome" type="text" id="nome" onFocus="MM_setTextOfTextfield('nome','','')" /><br>
		<input name="rg" value="RG" type="text" id="rg" onFocus="MM_setTextOfTextfield('rg','','')"/>
		<input name="cpf" value="CPF" type="text" id="cpf" onFocus="MM_setTextOfTextfield('cpf','','')"/><br>
		<input name="rua" value="Rua" type="text" id="rua" onFocus="MM_setTextOfTextfield('rua','','')"/>
		<input name="numero" value="N" type="text" id="numero" onFocus="MM_setTextOfTextfield('numero','','')"/><br>
		<input name="bairro" value="Bairro" type="text" id="bairro" onFocus="MM_setTextOfTextfield('bairro','','')"/>
		<input name="cidade" value="Cidade" type="text" id="cidade" onFocus="MM_setTextOfTextfield('cidade','','')"/>
		<select name="estado" id="estado">
			<option value="AC">AC</option>
			<option value="AL">AL</option>
			<option value="AM">AM</option>
			<option value="AP">AP</option>
			<option value="BA">BA</option>
			<option value="CE">CE</option>
			<option value="DF">DF</option>
			<option value="ES">ES</option>
			<option value="GO">GO</option>
			<option value="MA">MA</option>
			<option value="MG">MG</option>
			<option value="MS">MS</option>
			<option value="MT">MT</option>
			<option value="PA">PA</option>
			<option value="PB">PB</option>
			<option value="PE">PE</option>
			<option value="PI">PI</option>
			<option value="PR" selected="selected">PR</option>
			<option value="RJ">RJ</option>
			<option value="RN">RN</option>
			<option value="RO">RO</option>
			<option value="RR">RR</option>
			<option value="SE">SE</option>
			<option value="SP">SP</option>
			<option value="TO">TO</option>
		</select> <br>
		<input name="residencial" value="Fone Residencial" type="text" id="residencial" onFocus="MM_setTextOfTextfield('residencial','','')"/>
		<input name="comercial" value="Fone Comercial" type="text" id="comercial" onFocus="MM_setTextOfTextfield('comercial','','')"/>
		<input name="celular" value="Fone Celular" type="text" id="celular" onFocus="MM_setTextOfTextfield('celular','','')"/><br>
		<input name="email" value="E-mail" type="text" id="email" onFocus="MM_setTextOfTextfield('email','','')"/><br>
	</div>
	<div id="form_titulo">
		DADOS DA VIAGEM
	</div>
	<div id="dados_viagem">
		<div id="destino">
			Escolha seu destino
			<input name="destino" type="radio" value="2" onclick="paraguai()" /> Paraguai
			<input name="destino" type="radio" value="1" onclick="sao_paulo()" /> São Paulo
		</div>
		<select name="dia" id="dia">
			<option value="0" selected="selected">Dia</option>
			<option value="1">1</option>
			<option value="2">2</option>
			<option value="3">3</option>
			<option value="4">4</option>
			<option value="5">5</option>
			<option value="6">6</option>
			<option value="7">7</option>
			<option value="8">8</option>
			<option value="9">9</option>
			<option value="10">10</option>
			<option value="11">11</option>
			<option value="12">12</option>
			<option value="13">13</option>
			<option value="14">14</option>
			<option value="15">15</option>
			<option value="16">16</option>
			<option value="17">17</option>
			<option value="18">18</option>
			<option value="19">19</option>
			<option value="20">20</option>
			<option value="21">21</option>
			<option value="22">22</option>
			<option value="23">23</option>
			<option value="24">24</option>
			<option value="25">25</option>
			<option value="26">26</option>
			<option value="27">27</option>
			<option value="28">28</option>
			<option value="29">29</option>
			<option value="30">30</option>
			<option value="31">31</option>
		</select>
		<select name="mes" id="mes">
			<option value="0" selected="selected">Mês</option>
			<option value="janeiro">Janeiro</option>
			<option value="fevereiro">Fevereiro</option>
			<option value="marco">Março</option>
			<option value="abril">Abril</option>
			<option value="maio">Maio</option>
			<option value="junho">Junho</option>
			<option value="junho">Julho</option>
			<option value="agosto">Agosto</option>
			<option value="setembro">Setembro</option>
			<option value="Outubro">Outubro</option>
			<option value="novembro">Novembro</option>
			<option value="dezembro">Dezembro</option>
		</select>
		<select name="ano" id="ano">
			<option value="0" selected="selected">Ano</option>
			<option value="2011">2011</option>
			<option value="2012">2012</option>
			<option value="2013">2013</option>
			<option value="2014">2014</option>
			<option value="2015">2015</option>
		</select>
		<select name="onibus" id="onibus">
			<option value="0" selected="selected">Tipo do Ônibus</option>
			<option value="1" >Executivo</option>
			<option value="2">Semi-leito</option>
			<option value="3">Leito</option>
			</select> <br>
<div id="paraguai" style="display:none;">

<select name="embarque" id="embarque">
	<option value="88" selected="selected">Local de Embarque</option>
	<option value="16">Campina Grande do Sul</option>
	<option value="17">Estacionamento da Empresa BR 116 / Próx. CCV e Habib’s</option>
	<option value="18">Hospital Vita</option>
	<option value="19">Muffato Portão</option>
	<option value="20">Praça Rui Barbosa</option>
	<option value="21">Quatro Barras</option>
	<option value="22">São José dos Pinhais</option>
	<option value="23">Shopping Italia</option>
	<option value="24">Terminal Boqueirão</option>
	<option value="25">Terminal Capão Raso</option>
	<option value="26">Terminal Carmo</option>
	<option value="27">Terminal Hauer</option>
	<option value="28">Terminal Pinheirinho</option>
	<option value="29">Terminal Sítio Cercado</option>
	<option value="30">Terminal Guadalupe</option>
   </select>

</div>

<div id="sao_paulo" style="display:none;">

<select name="embarque" id="embarque">
	<option value="77" selected="selected">Local de Embarque</option>
	<option value="1">Araucária</option>
	<option value="2">Campina Grande do Sul</option>
	<option value="3">Campo Largo</option>
	<option value="4">Churrascaria Nova Estrela BR 116</option>
	<option value="5">Colombo</option>
	<option value="6">Estacionamento da Empresa BR 116 / Próx. CCV e Habib’s</option>
	<option value="7">Orleans (São Brás)</option>
	<option value="8">Shopping Italia</option>
	<option value="9">Parque Barigui</option>
	<option value="10">Quatro Barras</option>
	<option value="11">Sans Club BR 116</option>
	<option value="12">São José dos Pinhais</option>
	<option value="13">Terminal do Boqueirão</option>
	<option value="14">Terminal do Carmo</option>
	<option value="15">Terminal do Hauer</option>
   </select>

</div>

		<textarea name="observacoes" value="Observações" id="observacoes" /> </textarea>
		<div id="form_enquete">
			Como conheceu a Rotha Turismo?
			<select name="enquete" id="enquete">
				<option value="1" selected="selected">Indicação</option>
				<option value="2">Pesq. Internet</option>
				<option value="3">Já sou cliente</option>
				<option value="4">Outro</option>
			</select>
		</div>
		<div id="form_titulo">
			<input name="Enviar" type="submit" id="Enviar" value="Enviar" />
			<input name="Limpar" type="reset" id="Limpar" value="Limpar" />
		</div>
	</div>
</div>
</form>
<div>

<script type="text/javascript">
function MM_setTextOfTextfield(objId,x,newText) { //v9.0
 with (document){ if (getElementById){
   var obj = getElementById(objId);} if (obj) obj.value = newText;
 }
}

function paraguai()
    { 
      document.getElementById('paraguai').style.display="block";
   document.getElementById('sao_paulo').style.display="none";
    }

function sao_paulo()
    { 
      document.getElementById('sao_paulo').style.display="block";
   document.getElementById('paraguai').style.display="none";
    }

</script>

</body>
</html>

 

Porém quando eu envio as variáveis para a página que vai receber e enviar por e-mail não chega a informação que está na minha DIV ID=embarque, a 2ª opção.

Como se eu não existisse meu javascript e ele interpretasse a última DIV, como sendo válida.

 

Pergunta:

O que eu estou fazendo errado?

Não se se consegui me expressar adequadamente, mas gostaria de uma luz de alguém se possível.

 

Agradeço desde já.

Fique com Deus e até mais.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

não duplique IDs

 

                <a id="botao" href="index.php?link=home">Home</a>
               <a id="botao" href="index.php?link=sao_paulo">São Paulo</a>
               <a id="botao" href="index.php?link=paraguai">Paraguai</a>
               <a id="botao" href="index.php?link=dicas">Informações</a>

ID deve ser um identificador unico no documento

o mesmo para o name="" dos selects.

 

por você ter 2 selects com o mesmo name, um sobrescreve o outro.

dê names diferentes, ai você não vai ter mais problemas.

Compartilhar este post

Link para o post
Compartilhar em outros sites

kamipress    0

kamipress
Postado

Obrigado por responder William.

 

Realmente, foi só trocar as "ID" e "Name" para diferentes que funcionou.

 

Tenho mais uma pergunta.

 

Sendo assim independente se o usuário está vendo ou não os valores vão todos do mesmo jeito.

O Javascript então não altera o conteúdo do HTML somente a exibição para o usuário.

Então tenho que otimizar seguindo essa lógica.

 

Está certo essa linha de pensamento?

 

Novamente agradeço.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

sim, exatamente.

 

js não altera o código fonte real, apenas o virtual.

se você apertar Ctrl+U, nada doq você fez com js vai aparecer.

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