Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Galera abaixo tenho uma página php..
<?php include("cabecalho.php");?>
<h1>Cadastro de Cliente</h1>
<form action="" method="post">
<table class="table">
<tr>
<td>Pessoa</td>
<td>
<select name="tipoPessoa">
<option value="01">Fisica</option>
<option value="02">Juridica</option>
</select>
</td>
</tr>
</table>
</form>
<?php include("rodape.php");?>Tem algum exemplo?
Há inúmeros exemplos e tutoriais sobre Ajax na Internet. Dê uma pesquisa no Google.
Se utilizar jQuery, fica ainda mais simples :)
Bom dia
usa esse exemplo
<html>
<head>
<title>Título</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script>
function exibe_areas(el) {
var objAluguel = document.getElementById("aluguel");
var objVenda = document.getElementById("venda");
var objTemporada = document.getElementById("temporada");
var numCheckboxes = document.form1.elements['opcao'];
var ShowDiv = document.getElementById("divShow_"+el);
var idCheckbox = "document.form1.opcao["+el+"]";
idCheckbox = eval(idCheckbox);//Apagando todos os divs que possam estar abertos:
for (var i=0; i<numCheckboxes.length; i++) {
var objDiv = document.getElementById("divShow_"+i);
objDiv.style.display = "none";
}
//alert(idCheckbox.value);
if (idCheckbox.checked == true) {
ShowDiv.style.display = "block";
}
}
</script>
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<form name="form1" method="post" action="">
<tr>
<td width="3%"><input type="checkbox" name="opcao" id="aluguel" value="1" onclick="exibe_areas(0);"></td>
<td width="97%">Aluguel</td>
</tr>
<tr>
<td><input type="checkbox" name="opcao" id="venda" value="2" onclick="exibe_areas(1);"></td>
<td>Venda</td>
</tr>
<tr>
<td><input type="checkbox" name="opcao" id="temporada" value="3" onclick="exibe_areas(2);"></td>
<td>Aluguel de temporada</td>
</tr>
<tr>
<td colspan="2">
<div id="divShow_0" style="display:none;">Conteúdo da div escondida 1</div>
<div id="divShow_1" style="display:none;">Conteúdo da div escondida 2</div>
<div id="divShow_2" style="display:none;">Conteúdo da div escondida 3</div>
</td>
</tr>
</form>
</table>
</body>
</html>Obrigado, porem executei mas não obtive exito, nada acontece.
bah, aí eu não sei. Utilizo esse código normalmente.
Quando seleciono algum check ele nao traz nada..
<html>
<head>
<title>Título</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script>
function exibe_areas(el) {
var objAluguel = document.getElementById("aluguel");
var objVenda = document.getElementById("venda");
var objTemporada = document.getElementById("temporada");
var numCheckboxes = document.form1.elements['opcao'];
var ShowDiv = document.getElementById("divShow_"+el);
var idCheckbox = "document.form1.opcao["+el+"]";
idCheckbox = eval(idCheckbox);//Apagando todos os divs que possam estar abertos:
for (var i=0; i<numCheckboxes.length; i++) {
var objDiv = document.getElementById("divShow_"+i);
objDiv.style.display = "none";
}
//alert(idCheckbox.value);
if (idCheckbox.checked == true) {
ShowDiv.style.display = "block";
}
}
</script>
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<form name="form1" method="post" action="">
<tr>
<td width="3%"><input type="checkbox" name="opcao" id="aluguel" value="1" onclick="exibe_areas(0);"></td>
<td width="97%">Aluguel</td>
</tr>
<tr>
<td><input type="checkbox" name="opcao" id="venda" value="2" onclick="exibe_areas(1);"></td>
<td>Venda</td>
</tr>
<tr>
<td><input type="checkbox" name="opcao" id="temporada" value="3" onclick="exibe_areas(2);"></td>
<td>Aluguel de temporada</td>
</tr>
<tr>
<td colspan="2">
<div id="divShow_0" style="display:none;">Conteúdo da div escondida 1</div>
<div id="divShow_1" style="display:none;">Conteúdo da div escondida 2</div>
<div id="divShow_2" style="display:none;">Conteúdo da div escondida 3</div>
</td>
</tr>
</form>
</table>
</body>
</html>>
<html>
<head>
<title>Título</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script>
function exibe_areas(el) {
var objAluguel = document.getElementById("aluguel");
var objVenda = document.getElementById("venda");
var objTemporada = document.getElementById("temporada");
var numCheckboxes = document.form1.elements['opcao'];
var ShowDiv = document.getElementById("divShow_"+el);
var idCheckbox = "document.form1.opcao["+el+"]";
idCheckbox = eval(idCheckbox);//Apagando todos os divs que possam estar abertos:
for (var i=0; i<numCheckboxes.length; i++) {
var objDiv = document.getElementById("divShow_"+i);
objDiv.style.display = "none";
}
//alert(idCheckbox.value);
if (idCheckbox.checked == true) {
ShowDiv.style.display = "block";
}
}
</script>
</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<form name="form1" method="post" action="">
<tr>
<td width="3%"><input type="checkbox" name="opcao" id="aluguel" value="1" onclick="exibe_areas(0);"></td>
<td width="97%">Aluguel</td>
</tr>
<tr>
<td><input type="checkbox" name="opcao" id="venda" value="2" onclick="exibe_areas(1);"></td>
<td>Venda</td>
</tr>
<tr>
<td><input type="checkbox" name="opcao" id="temporada" value="3" onclick="exibe_areas(2);"></td>
<td>Aluguel de temporada</td>
</tr>
<tr>
<td colspan="2">
<div id="divShow_0" style="display:none;">Conteúdo da div escondida 1</div>
<div id="divShow_1" style="display:none;">Conteúdo da div escondida 2</div>
<div id="divShow_2" style="display:none;">Conteúdo da div escondida 3</div>
</td>
</tr>
</form>
</table>
</body>
</html>Agora sim.. funcionou.. obrigado
Para carregar conteúdo sem recarregar a página, você precisa usar Ajax