pasar parametros con ajax a php Código PHP:
<html>
<head>
<link href="style.css" rel="stylesheet" type="text/css" />
<script src="grafica.js" type="text/javascript"></script>
<script type="text/javascript">
var param1= document.getElementById(select1);
var param1a = param1.options[param1.selectedIndex].value;
var param2= document.getElementById(select2);
var param2a = param2.options[param2.selectedIndex].value;
var param3= document.getElementById(select3);
var param3a = param3.options[param3.selectedIndex].value;
</script>
<title>Tutorial CSS</title>
</head>
<body>
<div class="head">
<img src="presupuesto.jpg">
<img src="select.jpg">
<img src="param.jpg">
</div>
<div class="head2">
<img src="grafica.jpg">
</div>
<div class="body">
<form id="form_izq" method:"POST" onsubmit="FAjax('imagengrafica.php','graficai','campo='+param3a+'&mes='+param1a+'&tip_presu='+param2a,'POST')">
<label class="txthead">Seleccione Los Parametros</label>
<div class="align">
<label class="meses"><strong>Seleccione El Mes:</strong></label>
<select class="select1" name="mes" id="select1">
<option value="ENERO">ENERO</option>
<option value="FEBRERO">FEBRERO</option>
<option value="MARZO">MARZO</option>
<option value="ABRIL">ABRIL</option>
<option value="MAYO">MAYO</option>
<option value="JUNIO">JUNIO</option>
<option value="JULIO">JULIO</option>
<option value="AGOSTO">AGOSTO</option>
<option value="SEPTIEMBRE">SEPTIEMBRE</option>
<option value="OCTUBRE">OCTUBRE</option>
<option value="NOVIEMBRE">NOVIEMBRE</option>
<option value="DICIEMBRE">DICIEMBRE</option>
</select>
<div class="align">
<label class="meses"><strong>Tipo De Presupuesto:</strong></label>
<select name="tip_presu" class="select2" id="select2">
<?php
include_once("confDB.php");
$makeconn = new Connect;
$makeconn->constructMySQL(localhost,root,vacamuerta);
$makeconn->connectMySQL();
$selectdb = new Connect;
$selectdb->consSelectDB(presupuesto);
$sql = "SELECT * FROM tipo_presu";
$query = mysql_query($sql) ;
while($result = mysql_fetch_array($query)){
echo "<option value=".$result[tipo_presu].">".$result[nombre]."</option><br>";
};
?>
</select>
</div>
<div class="align">
<label class="meses"><strong>Linea:</strong></label>
<select class="select3" name="campo" id="select3">
<option value="presu_diario_acum_pollo">POLLO</option>
<option value="presu_diario_acum_dks">DELICHICKS</option>
<option value="presu_diario_acum_manza">MANZANARES</option>
</select>
</div>
<input class="btn" type="submit" name="enviar" value="GRAFICAR"></input>
</form>
</div>
</div>
<div id="grafica">
<img id=graficai ></img
</div>
</body>
</html> y este el codigo de javascript
Código:
function creaAjax(){
var objetoAjax=false;
try {
objetoAjax = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
objetoAjax = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (E) {
objetoAjax = false;
}
}
if (!objetoAjax && typeof XMLHttpRequest!='undefined') {
objetoAjax = new XMLHttpRequest();
}
return objetoAjax;
}
function FAjax (url,capa,valores,metodo)
{
var ajax=creaAjax();
var capaContenedora = document.getElementById(capa);
/*Creamos y ejecutamos la instancia si el metodo elegido es POST*/
if(metodo.toUpperCase()=='POST'){
ajax.open ('POST', url, true);
ajax.onreadystatechange = function() {
if (ajax.readyState==1) {
capaContenedora.innerHTML="Cargando.......";
}
else if (ajax.readyState==4){
if(ajax.status==200)
{
document.getElementById(capa).innerHTML=ajax.responseText;
}
else if(ajax.status==404)
{
capaContenedora.innerHTML = "La direccion no existe";
}
else
{
capaContenedora.innerHTML = "Error: ".ajax.status;
}
}
}
ajax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
ajax.send(valores);
return;
}
/*Creamos y ejecutamos la instancia si el metodo elegido es GET*/
if (metodo.toUpperCase()=='GET'){
ajax.open ('GET', url, true);
ajax.onreadystatechange = function() {
if (ajax.readyState==1) {
capaContenedora.innerHTML="Cargando.......";
}
else if (ajax.readyState==4){
if(ajax.status==200){
document.getElementById(capa).innerHTML=ajax.responseText;
}
else if(ajax.status==404)
{
capaContenedora.innerHTML = "La direccion no existe";
}
else
{
capaContenedora.innerHTML = "Error: ".ajax.status;
}
}
}
ajax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
ajax.send(null);
return
}
}
gracias a todoss
