escribo por q no puedo ejecutar una llamada a la funcio ajax, para insertar unos elementos a la base de datos, aqui adjunto el codigo, y q me muestre la consulta en el <div id="resultado_proce">
el tema es q el formulario no me toma encuenta la llamada a la funcion ajax y cuando hago el submit me recarga la pagina y en la barra de navegacion me aparece lo siguiente:
http://localhost/prueba_ingreso_ajax/crear_presupuesto_proce.php?presuNum=36&id_selecci onado=1&nombre_seleccionado=Composi+Simple&costo_s eleccionado=14000&desc_seleccionado=mkiumumiu&Subm it=Grabar
y no me ingresa nada a la base de datos, es raro, sera por q hay funciones js en la pagina?
Código:
<html>
<head>
<title>Registro con AJAX</title>
<script language="JavaScript" type="text/javascript" src="ajax.js"></script>
</head>
<script language="javascript">
function cargarDatos(id) {
celda1 = id;
celda2 = document.getElementById('row'+id).cells[0].innerHTML;
celda3 = document.getElementById('row'+id).cells[1].innerHTML;
document.getElementById('id_seleccionado').value = celda1;
document.getElementById('nombre_seleccionado').value = document.getElementById('row'+id).cells[0].innerHTML;
document.getElementById('costo_seleccionado').value = document.getElementById('row'+id).cells[1].innerHTML;
verElemento('1');
}
function verElemento(idElemento)
{
if(idElemento.value=='1'){
document.getElementById('procedimiento').style["display"] = "none"
} else{
document.getElementById('procedimiento').style["display"] = "block"
}
}
</script>
<body>
<p>Presupuesto N° : </p> <?php echo $_GET['id'] ?>
<p>Rut : </p> <?php echo $_GET['rut'] ?>
<p>Nombre : </p> <?php echo $_GET['nombre_1'] ?>
<p>Apellido : </p> <?php echo $_GET['apellido'] ?>
<?php
include_once("cProcedimiento.php");
//consulta todos los procedimientos
$objprocedimiento = new cProcedimiento;
$consulta=$objprocedimiento->consultar();
?>
<table id="proce" style="border:1px solid #FF0000; color:#000099;width:400px;">
<thead>
<tr>
<th>Procedimiento</th>
<th>Costo</th>
<th></th>
</tr>
</thead>
<tbody>
<?php
while($row=mysql_fetch_array($consulta)){?>
<tr id="row<?php echo $row['PROCE_ID'] ?>">
<td><?php echo $row['PROCE_NOMBRE'] ?></td>
<td><?php echo $row['PROCE_COSTO'] ?></td>
<td><a href="javascript:cargarDatos(<?php echo $row['PROCE_ID'] ?>)"><img src="imagenes/btn_enviar.jpg" alt="Siguiente formulario" width="100" height="30" border="0"/></a></td>
</tr>
<?php } ?>
</tbody>
</table>
<br/>
<div id="procedimiento" style="display:none" >
<?php echo $_GET['id'] ?>
<form id="nuevo_proce" name="nuevo_proce" onsubmit="enviarDatosProcedimiento(); return false">
<input type="hidden" name="presuNum" value="1" />
<input type="hidden" name="id_seleccionado" id="id_seleccionado" value=""/>
<input type="text" name="nombre_seleccionado" id="nombre_seleccionado" value=""/>
<input type="text" name="costo_seleccionado" id="costo_seleccionado" value="" readonly="readonly" />
<input type="text" name="desc_seleccionado" id="desc_seleccionado" value="" />
<p>
<label>
<input type="submit" name="Submit" value="Grabar" />
</label>
</p>
</form>
</div>
<div id="resultado_proce">
</div>
<p>Total
<label>
<input name="total" type="text" readonly="readonly" />
</label>
</p>
</body>
</html>
ajax.js donde esta la funcion q me llama a la accion para almacenarla en la base de datos
Código:
function 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 enviarDatosProcedimiento(){
//donde se mostrará lo resultados
divResultado = document.getElementById('resultado_proce');
divResultado.innerHTML= '<img src="anim.gif">';
//valores de las cajas de texto
id=document.nuevo_proce.presuNum.value;
id_proce=document.nuevo_proce.id_seleccionado.value;
desc=document.nuevo_proce.desc_seleccionado.value;
//instanciamos el objetoAjax
ajax=objetoAjax();
//uso del medoto POST
//archivo que realizará la operacion
//registro.php
ajax.open("POST", "registroProcedimiento.php",true);
ajax.onreadystatechange=function() {
if (ajax.readyState==4) {
//mostrar resultados en esta capa
divResultado.innerHTML = ajax.responseText
//llamar a funcion para limpiar los inputs
ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//enviando los valores
ajax.send("presuNum="+id+"&id_seleccionado="+id_proce+"&desc_seleccionado="+desc)
}
La accion: registroProcedimiento
Código:
<?php
include_once("cProcedimiento.php");
$id=$_POST['presuNum'];
$id_proce=$_POST['id_seleccionado'];
$desc=$_POST['desc_seleccionado'];
sleep(2);
$objprocedimiento=new cProcedimiento;
if ($objprocedimiento->crearProceAsociado($id,$id_proce,$desc)==true){
echo "Registro grabado correctamente";
}else{
echo "Error de grabacion";
}
include('consulta_procedimiento.php');
?>
Y la consulta: consulta_Procedimiento
Código:
<?php
include_once("cProcedimiento.php");
$objprocedimiento=new cProcedimiento;
$lista= $objprocedimiento->consultarProceAsociado();
?>
<table style="border:1px solid #FF0000; color:#000099;width:400px;">
<tr style="background:#99CCCC;">
<td>Presupuesto</td>
<td>Procedimiento</td>
<td>Descripcion</td>
</tr>
<?php
while($row=mysql_fetch_array($lista)){?>
<tr>
<td><?php echo $row['PRESU_ID'] ?></td>
<td><?php echo $row['PROCE_ID'] ?></td>
<td><?php echo $row['POSEE_DESCRIPCION'] ?></td>
</tr>
<?php } ?>
</table>
