Tengo un problema con el codigo ajax... al ejecutar el index.php, si me desaparece bien el comobobox con un dato seleccionado y me aparece impreso en otro div con el dato al darle al boton aceptar, pero lo que tambien quiero siguiendo de eso, es que si quiero cambiar el dato(color) al darle click en el texto cambiar, ahora desaparesca el div con el dato impreso y me devuelva al div del combo para seleccionar otro dato...
estoy atorado en esto... una ayuda por favor...
Codigo ajax:
Código Javascript
:
Ver originalfunction objetoAjax(){
var xmlhttp=false;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}
function datos(){
//document.getElementById("combo").style.display == 'none'
//document.getElementById("boton").style.display == 'none'
document.getElementById("combo").style.display = "none";
document.getElementById("combo").style.visibility = "hidden";
//donde se mostrará el resultado
divResultado = document.getElementById('resultado');
//tomamos el valor de la lista desplegable
col=document.formulario.s_colonia.value;
//instanciamos el objetoAjax
ajax=objetoAjax();
//usamos el medoto POST
//archivo que realizará la operacion
ajax.open("POST", "muestra_resultado.php",true);
ajax.onreadystatechange=function() {
if (ajax.readyState==4) {
//mostrar resultados en esta capa
divResultado.innerHTML = ajax.responseText
}
}
ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//enviando los valores
ajax.send("colonia="+col)
}
function cambiar(){
document.getElementById("resultado").style.display = "block";
document.getElementById("resultado").style.visibility = "visible";
document.getElementById("combo").style.display = "block";
document.getElementById("combo").style.visibility = "visible";
}
Codigo muestra_resultado.php:
Código PHP:
Ver original<div style="float: left; background: #F93;">
<?
include("conexionbd.php");
//capturar la colonia
$colonia = $_POST['colonia'];
echo $colonia;
?>
</div>
Codigo index.php
Código PHP:
Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Aparece Div</title>
<script language="JavaScript" type="text/javascript" src="ajax.js"></script>
</head>
<body>
<form name="formulario" id="formulario" method="POST" action="form.php">
<div style="float: left; width:700px; height: 80px;">
<div id="resultado" style="float: left; width:650px; height: 70px; background: #FC0;">
<div id="combo" style="float: left; width: 400px; height: 40px;">
<select name="s_colonia" id="s_colonia" onChange="poner_cp()">
<option>Rojo</option>
<option>Azul</option>
<option>Amarillo</option>
<option>Verde</option>
<option>Cafe</option>
</select>
</div>
<div id="boton" style="float: left; width: 81px; height: 31px;">
<img src="btn_aceptar.png" width="81" height="31" style="cursor: pointer" onClick="datos()">
</div>
</div>
</div>
<div style="float:left; width:100px;">
<a onclick="cambiar()" style="cursor: pointer;">cambiar</a>
</div>
</form>
</body>
</html>