Ir para conteúdo

POWERED BY:

Arquivado

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

c0de

Mudar um combo para um campo input text

Recommended Posts

Eu tenho um site que possui uma combo que é alimentada de acordo com o radio button selecionado, mas dependendo do radio button selecionado, ele deve retirar a combo box e no lugar dessa combo box colocar um campo input text. Como faço isso ou onde posso encontrar um script que faça isso?Agradeço desde já.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Segue o script.

 

function AlimentarSelect(ValorLista) {if (ValorLista == "EN") {  option0 = new Option("",0)<% response.write ("  option1 = new Option(""Laranja"",1)") %>  option2 = new Option("Uva",2)  document.oficio.demandantes.options[0] = option0  document.oficio.demandantes.options[1] = option1  document.oficio.demandantes.options[2] = option2  return;  }if (ValorLista == "PR") {  option0 = new Option("",0)  option1 = new Option("Cerveja",1)  option2 = new Option("Refrigerante",2)  document.oficio.demandantes.options[0] = option0  document.oficio.demandantes.options[1] = option1  document.oficio.demandantes.options[2] = option2  return;  }if (ValorLista == "OU") {  option0 = new Option("",0)  option1 = new Option("Opção1",1)  option2 = new Option("Opção2",2)  document.oficio.demandantes.options[0] = option0  document.oficio.demandantes.options[1] = option1  document.oficio.demandantes.options[2] = option2  return;  }if (ValorLista == "PV") {  option0 = new Option("",0)  option1 = new Option("Opção1",1)  option2 = new Option("Opção2",2)  document.oficio.demandantes.options[0] = option0  document.oficio.demandantes.options[1] = option1  document.oficio.demandantes.options[2] = option2  return;  }if (ValorLista == "DJ") {  option0 = new Option("",0)  option1 = new Option("Opção1",1)  option2 = new Option("Opção2",2)  document.oficio.demandantes.options[0] = option0  document.oficio.demandantes.options[1] = option1  document.oficio.demandantes.options[2] = option2  return;  }}//--></script>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Segue o script.

function AlimentarSelect(ValorLista) {if (ValorLista == "EN") {  option0 = new Option("",0)<% response.write ("  option1 = new Option(""Laranja"",1)") %>  option2 = new Option("Uva",2)  document.oficio.demandantes.options[0] = option0  document.oficio.demandantes.options[1] = option1  document.oficio.demandantes.options[2] = option2  return;  }if (ValorLista == "PR") {  option0 = new Option("",0)  option1 = new Option("Cerveja",1)  option2 = new Option("Refrigerante",2)  document.oficio.demandantes.options[0] = option0  document.oficio.demandantes.options[1] = option1  document.oficio.demandantes.options[2] = option2  return;  }if (ValorLista == "OU") {  option0 = new Option("",0)  option1 = new Option("Opção1",1)  option2 = new Option("Opção2",2)  document.oficio.demandantes.options[0] = option0  document.oficio.demandantes.options[1] = option1  document.oficio.demandantes.options[2] = option2  return;  }if (ValorLista == "PV") {  option0 = new Option("",0)  option1 = new Option("Opção1",1)  option2 = new Option("Opção2",2)  document.oficio.demandantes.options[0] = option0  document.oficio.demandantes.options[1] = option1  document.oficio.demandantes.options[2] = option2  return;  }if (ValorLista == "DJ") {  option0 = new Option("",0)  option1 = new Option("Opção1",1)  option2 = new Option("Opção2",2)  document.oficio.demandantes.options[0] = option0  document.oficio.demandantes.options[1] = option1  document.oficio.demandantes.options[2] = option2  return;  }}//--></script>
Os seguintes são os inputs usados:<input type="radio" value="EN" name="demandante" onclick="AlimentarSelect('EN');">Gostaria que neste radio button ao clicar substituir o campo de combo box para input do tipo texto... <input type="radio" value="OU" name="demandante" onclick="ToInputText();"><select size="1" name="demandantes"></select>Obrigado e desculpe a ignorancia.

Compartilhar este post


Link para o post
Compartilhar em outros sites

O form é muito grande, as partes principais e que devem fazer diferença são essas, mas segue o form:

 

<form method="POST" action="oficio.asp" onsubmit="return FrontPage_Form1_Validator(this)" name="oficio" webbot-action="--WEBBOT-SELF--">  <!--webbot bot="SaveResults" startspan U-File="../_private/form_results.txt"  S-Format="TEXT/CSV" S-Label-Fields="TRUE" --><input TYPE="hidden" NAME="VTI-GROUP" VALUE="0"><!--webbot  bot="SaveResults" endspan i-checksum="43374" -->  <p align="center" class="titulo"><b>OFÍCIO / MALOTE / FAC-SÍMILE</b></p>  <p align="center">  <table class="padrao">	<tr>	  <td width="33%">PROTOCOLO</td>	  <td width="27%">DATA</td>	  <td width="40%">OPERADOR</td>	</tr>	<tr>	  <td width="33%"><input type="text" name="T1" size="20"></td>	  <td width="17%"><!--webbot bot="Validation" S-Data-Type="Integer"		S-Number-Separators="x" B-Value-Required="TRUE" I-Minimum-Length="2"		I-Maximum-Length="2" --><input type="text" name="dia" size="2" maxlength="2">/<!--webbot		bot="Validation" S-Data-Type="Integer" S-Number-Separators="x"		B-Value-Required="TRUE" I-Minimum-Length="2" I-Maximum-Length="2" --><input type="text" name="mes" size="2" maxlength="2">/<!--webbot		bot="Validation" S-Data-Type="Integer" S-Number-Separators="x"		B-Value-Required="TRUE" I-Minimum-Length="4" I-Maximum-Length="4" --><input type="text" name="ano" size="4" maxlength="4"></td><%Set op = CONEXAO.EXECUTE(selectOperadorAtivo(1))%>	  <td width="40%"><!--webbot bot="Validation"		S-Display-Name="---SELECIONE O OPERADOR---" B-Disallow-First-Item="TRUE"		--><select size="1" name="operador" class="dropdown">		  <option selected data value="0">---SELECIONE O OPERADOR---</option> <%do while not op.EOF   if (novo <> 1) then	  if (op("CódigoOperador")=rs("Operador")) then%>		  <option data selected value="<%=op("CódigoOperador")%>"><%=op("NomeOperador")%></option><%	  else%>		  <option data value="<%=op("CódigoOperador")%>"><%=op("NomeOperador")%></option><%	  end if   else%>		  <option data value="<%=op("CódigoOperador")%>"><%=op("NomeOperador")%></option><% end ifop.movenextLoop%>		</select></td>	</tr>  </table><br>  <table class="padrao">	<tr>	  <td width="100%" colspan="3">		<p align="center"><b><u>TIPOS DE DEMANDANTES</u></b></td>	</tr>	<tr>	  <td width="33%"><input type="radio" value="EN" name="demandante" onclick="AlimentarSelect('EN');">Escritório de		Negócios</td>	  <td width="33%"><input type="radio" value="PR" name="demandante" onclick="AlimentarSelect(PR);">Prefeituras</td>	  <td width="34%"><input type="radio" value="OU" name="demandante" onclick="AlimentarSelect('OU');">Outros</td>	</tr>	<tr>	  <td width="33%"><input type="radio" value="PV" name="demandante" onclick="AlimentarSelect('PV');">Pontos de Vendas</td>	  <td width="33%"><input type="radio" value="DJ" name="demandante" onclick="AlimentarSelect('DJ');">Demandas		Judiciais</td>	  <td width="34%"> </td>	</tr>	<tr>	  <td width="33%">DEMANDANTE</td>	  <td width="33%">NOME - CONTATO</td>	  <td width="34%"></td>	</tr>	<tr>	  <td width="33%"><select size="1" name="demandantes">		</select></td>	  <td width="33%"><input type="text" name="contato" size="40"></td>	  <td width="34%"></td>	</tr>  </table> <!--ASSUNTOS E DETALHES-->  <table  class="padrao">	<tr>	  <td width="100%" colspan="3" align="center">		<p align="center"><b><u>DETALHE</u></b></p>	  </td>	</tr>	<tr><%Set ass = CONEXAO.EXECUTE("SELECT * FROM [P:AssuntoSisac]")aux=1Do While Not ass.EOF%>	  <td width="33%"><input type="radio" name="detalhe" value="<%=ass("Tabela")%>" onclick="AlimentarSelectAssunto('<%=ass("Tabela")%>');"><%=ass("Assunto")%></td><%ass.movenextif not ass.EOF then%>	  <td width="33%"><input type="radio" name="detalhe" value="<%=ass("Tabela")%>" onclick="AlimentarSelectAssunto('<%=ass("Tabela")%>');"><%=ass("Assunto")%></td><%ass.movenextend ifif aux=1 then  aux=0%>	  <td width="34%"><select size="1" id="assunto" name="assunto" class="dropdown">		<option value="0">---ESCOLHA UMA OPÇÃO AO LADO---</option>	  </select></td><%end if%>	</tr><%Loop%>  </table>   <table class="padrao">	<tr>	  <td width="100%" colspan="2" align="center">		<p align="center"><b><u>CHAVE</u></b></p>	  </td>	</tr>	<tr>	  <td width="33%"><input type="radio" name="R3" value="pis" />PIS /		NIS / NIT / CEI</td>	  <td width="33%"></td>	</tr>	<tr>	  <td width="33%"><input type="radio" name="R3" value="cpf">CPF</td>	  <td width="33%">DETALHE</td>	</tr>	<tr>	  <td width="33%"><input type="radio" name="R3" value="outros">Outros</td>	  <td width="33%"><input type="text" name="detalhe_chave" size="20"></td>	</tr>  </table><br>  <table class="padrao">	<tr>	  <td width="66%" colspan="2">NOME do (Trabalhador / Empregado /		Beneficiário / Estudante)</td>	  <td width="34%"> </td>	</tr>	<tr>	  <td width="100%" colspan="3"><input type="text" name="nome" size="80"></td>	</tr>	<tr>	  <td width="33%">DATA</td>	  <td width="33%">OPERADOR</td>	  <td width="34%"></td>	</tr>	<tr>	  <td width="33%"><!--webbot bot="Validation" S-Data-Type="Integer"		S-Number-Separators="x" B-Value-Required="TRUE" I-Minimum-Length="2"		I-Maximum-Length="2" --><input type="text" name="dia1" size="2" maxlength="2">/<!--webbot		bot="Validation" S-Data-Type="Integer" S-Number-Separators="x"		B-Value-Required="TRUE" I-Minimum-Length="2" I-Maximum-Length="2" --><input type="text" name="mes1" size="2" maxlength="2">/<!--webbot		bot="Validation" S-Data-Type="Integer" S-Number-Separators="x"		B-Value-Required="TRUE" I-Minimum-Length="4" I-Maximum-Length="4" --><input type="text" name="ano1" size="4" maxlength="4"></td>	  <td width="33%"><select size="1" name="operador1">		</select></td>	  <td width="34%"></td>	</tr>  </table>  <input type="submit" value="Salvar" name="bSalvar" class="botao"> <input type="reset" value="Limpar" name="bLimpar" class="botao"></p></form>

ignore codigos asp e validação do frontpage. Obrigado.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Opa!

 

Caso ainda não tenha conseguido resolver o teu problema, sugiro que faças o seguinte:

 

-> Dentre as tags "script":

 

<script type="text/javascript>	// Função utilizada para alternar os campos que você quizer	function switchFields(){		var vl_radio;		// Aqui você captura o valor do radio		vl_radio = document.getElementById("meu_combo").value;		// Aqui você verifica se o valor que foi passado pelo radio necessita da exibição do edit 		if( vl_radio == "Precisa"){		  document.getElementById("meu_combo").style.display = "none";		  document.getElementById("meu_edit").style.display = "";		} else {		  document.getElementById("meu_combo").style.display = "";		  document.getElementById("meu_edit").style.display = "none";		}	}	// Função utilizada para capturar o nome do campo ativo	function getActiveField(){		if( document.getElementById("meu_combo").style.display == "none"){		document.getElementById("meu_hidden").value = "meu_edit";		} else {		document.getElementById("meu_hidden").value = "meu_combo";		}	}   </script>

-> E agora, no teu formulário:

 

<!-- Supondo que o nome do teu radiogroup seja "meu_radio" e os valores retornados "Precisa" e "N_Precisa" -->		<input type="radio" id="meu_radio" value="Precisa" onClick="switchFields(); getActiveField() return false;" />	<input type="radio" id="meu_radio" value="N_Precisa" onClick="switchFields(); getActiveField() return false;" />		<!-- Criaremos um campo hidden para na eventualidade de o teu server precisar recuperar o valor do edit ou da combo	você saber de qual dos dois vem o valor -->	<input type="hidde" size="20" name="meu_hidden" />		<!-- Agora crie o edit abaixo da tua combo - que, por sugestão, sempre deve estar visível - exceto se o radio	selecionado tiver o valor "N_Precisa" -->	<input type="text" size="20" name="meu_edit" style="display:none">

O segredo, como você pode observar, está na utilização do atributo "style" e na utilização da função "switchFields".

Utilizo este tipo de recurso com freqüência e asseguro-lhe que o mesmo é compatível com o FF e com o IE.

 

Espero ter ajudado, e se houver dúvida me escreva. ;)

 

Abraço!

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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