En esta oportunidad vamos a desarrollar un aplicación haciendo uso de AJAX para actualizar registros (UPDATE SET […]) . Usaremos la tabla empleados, que hemos venido usando en los artículos anteriores.
Quizá te interese: CRUD, insertar, consultar, actualizar y eliminar, con PHP + MySQL + jQuery
Objetivo
Lo que deseamos lograr es: En la página principal se muestre una lista de todos lo empleados registrados y que al hacer clic en el Nro Identificador de éste se active un formulario para realizar los cambios necesarios de sus datos, al hacer clic en el boton Actualizar, el formulario desaparecerá y el registro se actualizará. La aplicación que desarrollaremos no será muy elaborada, pero cumplirá con nuestro objetivo descrito.
Desarrollo
Entonces empecemos primero dando una explicación general del desarrollo, de acuerdo al objetivo:
- Realizaremos un script en PHP que conectará con la BD y realizará una consulta de todos los empleados. Pero además se nos pide que al hacer clic en ID del empleado se active un formulario y se muestren los datos del empleado seleccionado. Para capturar el ID crearemos una función en JavaScript, y para mostrar los datos del empleado seleccionado en un formulario crearemos un script en PHP.
- El formulario contendrá un boton Actualizar que realizará la accción de guardar los cambios del empleado. Para el envio de los datos haremos uso de una función en JavaScript y para realizar la actualización de los datos, un script en PHP con la sentencia UPDATE.
- Y por supuesto todo lo antes descrito haciendo uso del objeto XMLHttpRequest.
Funciones en JavaScript
ajax.js » Contiene 3 funciones. 1) Crea el objeto XMLHttpRequest dependiendo del navegador, 2) Enviará los datos del empleado para que se guardados y 3) Realiza una consulta del empleado mediante su ID.
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 enviarDatosEmpleado(){
//donde se mostrará lo resultados
divResultado = document.getElementById('resultado');
divFormulario = document.getElementById('formulario');
//valores de los inputs
id=document.frmempleado.idempleado.value;
nom=document.frmempleado.nombres.value;
dep=document.frmempleado.departamento.value;
suel=document.frmempleado.sueldo.value;
//instanciamos el objetoAjax
ajax=objetoAjax();
//usando del medoto POST
//archivo que realizará la operacion
//actualizacion.php
ajax.open("POST", "actualizacion.php",true);
ajax.onreadystatechange=function() {
if (ajax.readyState==4) {
//mostrar los nuevos registros en esta capa
divResultado.innerHTML = ajax.responseText
//mostrar un mensaje de actualizacion correcta
divFormulario.innerHTML = "<p style="border:1px solid red; width:400px;">La actualización se realizo correctamente</p>";
}
}
//muy importante este encabezado ya que hacemos uso de un formulario
ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//enviando los valores
ajax.send("idempleado="+id+"&nombres="+nom+"&departamento="+dep+"&sueldo="+suel)
}
function pedirDatos(idempleado){
//donde se mostrará el formulario con los datos
divFormulario = document.getElementById('formulario');
//instanciamos el objetoAjax
ajax=objetoAjax();
//uso del medotod GET
ajax.open("GET", "consulta_por_id.php?idemp="+idempleado);
ajax.onreadystatechange=function() {
if (ajax.readyState==4) {
//mostrar resultados en esta capa
divFormulario.innerHTML = ajax.responseText
//mostrar el formulario
divFormulario.style.display="block";
}
}
//como hacemos uso del metodo GET
//colocamos null
ajax.send(null)
}
Scripts en PHP: Consultas y Actualización de registros
consulta.php » Se conecta con la base de datos, realiza la consulta de todos los empleados y los muestra en una tabla. Hay que notar que en los items de la columna Código se agregar en el evento onclick la función pedirDatos().
<?php
//Configuracion de la conexion a base de datos
$bd_host = "localhost";
$bd_usuario = "root";
$bd_password = "";
$bd_base = "ribosomatic";
$con = mysql_connect($bd_host, $bd_usuario, $bd_password);
mysql_select_db($bd_base, $con);
//consulta todos los empleados
$sql=mysql_query("SELECT * FROM empleados",$con);
//muestra los datos consultados
//haremos uso de tabla para tabular los resultados
?>
<table>
<tr>
<td>Codigo</td>
<td>Nombres</td>
<td>Departamento</td>
<td>Sueldo</td>
</tr>
<?php
while($row = mysql_fetch_array($sql)){
echo " <tr>";
//mediante el evento onclick llamaremos a la funcion PedirDatos(), la cual tiene como parametro
//de entrada el ID del empleado
echo " <td><a style="text-decoration:underline;cursor:pointer;" onclick="pedirDatos('".$row['idempleado']."')">".$row['idempleado']."</a></td>";
echo " <td>".$row['nombres']."</td>";
echo " <td>".$row['departamento']."</td>";
echo " <td>".$row['sueldo']."</td>";
echo " </tr>";
}
?>
</table>
consulta_por_id.php » Este script realiza la consulta del empleado por su ID y el resultado los muestra en un formulario, listo para ser modificado. Note que en la etiqueta de inicio de <form>, hacemos uso del evento onsubmit para llamar a la función enviarDatosEmpleado().
<?php
//Configuracion de la conexion a base de datos
$bd_host = "localhost";
$bd_usuario = "root";
$bd_password = "";
$bd_base = "ribosomatic";
$con = mysql_connect($bd_host, $bd_usuario, $bd_password);
mysql_select_db($bd_base, $con);
//consulta los datos del empleado por su id
$idemp=$_GET['idemp'];
$sql=mysql_query("SELECT * FROM empleados WHERE idempleado=$idemp",$con);
$row = mysql_fetch_array($sql);
//valores de las consultas
$nom=$row['nombres'];
$dep=$row['departamento'];
$suel=$row['sueldo'];
//muestra los datos consultados en los campos del formulario
?>
<form name="frmempleado" action=""
onsubmit="enviarDatosEmpleado(); return false">
<input name="idempleado" type="hidden" value="<?php echo $idemp; ?>" />
<p>Nombres
<input name="nombres" type="text" value="<?php echo $nom; ?>" />
</p>
<p>Departamento
<select name="departamento">
<?php
echo "<option value="".$dep."">".$dep."</option>"
?>
<option value="Informatica">Informatica</option>
<option value="Contabilidad">Contabilidad</option>
<option value="Administracion">Administracion</option>
<option value="Logistica">Logistica</option>
</select>
</p>
<p>Sueldo <strong>S/.</strong>
<input name="sueldo" type="text" value="<?php echo $suel; ?>" />
</p>
<p>
<input type="submit" name="Submit" value="Actualizar" />
</p>
</form>
actualizacion.php » Este script realiza un UPDATE del registro que vamos a modificar, y luego llama al script consulta.php que mostrará todos los registros, incluido pues el recientemente modificado.
<?php
//Configuracion de la conexion a base de datos
$bd_host = "localhost";
$bd_usuario = "root";
$bd_password = "";
$bd_base = "ribosomatic";
$con = mysql_connect($bd_host, $bd_usuario, $bd_password);
mysql_select_db($bd_base, $con);
//variables POST
$idemp=$_POST['idempleado'];
$nom=$_POST['nombres'];
$dep=$_POST['departamento'];
$suel=$_POST['sueldo'];
//actualiza los datos del empleados
$sql="UPDATE empleados SET nombres='$nom', departamento='$dep', sueldo='$suel' WHERE idempleado=$idemp";
mysql_query($sql,$con);
include('consulta.php');
?>
Página principal
empleados_actualizacion.php » Esta es la pagina principal. Llamamos al archivo JavaScript, también hacemos un include del archivo consulta.php.
<html>
<head>
<title>Registro con AJAX</title>
<script language="JavaScript" type="text/javascript" src="ajax.js"></script>
</head>
<body>
<h2>Modificar datos del empleado</h2>
<p>Clic en el código del empleado para modificar sus datos. </p>
<div id="formulario">
</div>
<div id="resultado"><?php include('consulta.php');?></div>
</body>
</html>
Como mencione antes, la aplicación desarrollada es bien sencilla y he tratado de ser lo mas explicativo posible, pero si no estuviera claro pueden comentarlo. El archivo en .zip puedes descargarlo y probarlo. Puede ver la puesta en marcha de esta aplicación en la nueva sección Ejemplos.
Actualización [18.11.06]
La aplicación no funcionaba perfectamente en Internet Explorer , me di cuenta de ello gracias a los comentarios, así que probe la solución de Erick Blanco, la de usar el metodo POST en lugar de GET, para enviar el id del empleado en la función pedirDatos del archivo ajax.js, como también en el archivo consulta_por_id.php para recibir ese dato.
La función pedirDatos, del archivo ajax.js queda así:
function pedirDatos(idempleado){
//donde se mostrará el formulario con los datos
divFormulario = document.getElementById('formulario');
//instanciamos el objetoAjax
ajax=objetoAjax();
ajax.open("POST", "consulta_por_id.php");
ajax.onreadystatechange=function() {
if (ajax.readyState==4) {
//mostrar resultados en esta capa
divFormulario.innerHTML = ajax.responseText
//mostrar el formulario
divFormulario.style.display="block";
}
}
ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
//enviando los valores
ajax.send("idemp="+idempleado)
}
Ahora en el archivo consulta_por_id.php, reemplazamos está linea:
$idemp=$_GET['idemp'];
por esta otra:
$idemp=$_POST['idemp'];
Como verán hacemos uso del metodo POST en lugar de GET. En lo personal, uso el método POST para envio de valores por formulario y GET para envio por URL. Pero vale la pena probar con los dos métodos. Si no funciona uno, funcionará el otro. Mil disculpas por la tardía solución. El archivo del ejemplo está corregido.
Descargar ejemplo: Actualización de datos en AJAX
hola descargue el ejemplo de actualizacion de datos pero el que descargue me sale un error cuando quiero seleccionar un registro para actualizarlo no me da nada. me dice se requiere un objeto ojala y lo pudieran arreglar. esta muy bien los ejemplos
El archivo principal es empleados_actualizacion.php, prueba con ese. Además le di una revisada al ejemplo y no hay errores, quizas no configuraste correctamente tu conexion a la base de datos.
Cualquier otra consulta, estoy aqui.
Muyyyyyyyyyyyy buenos los articulos, pero he querido implementar lo del LitBox y no he podido, en el site del autor no hay mucha info, me podrias brindar una demo?, como la tienes implementada me gusto mucho, gracias !!
genial tus 2 aportes, se agradece bastante, llevo 4 días naufragando en búsqueda de esta información
esta excelente todo esto
ah jajaja… bacan
Es muy probable que incluya algunos ejemplos de como usar el LitBox. Disculpa por demorar en responder.
Y cuando podrían estar esos ejemplos, estoy que me desarollo…jejejeje, gracias.
Hola, buen ejemplo, pero mi pregunta es si conoces algun metodo para hacer que el objeto se refresque. Me explico, cuando selecciono un registo para su modificacion, se cargan los datos de ese registro y hago la modificacion todo sin problemas, pero si vuelvo a seleccionar el mismo objeto, me carga los datos antiguos no los que he modificado.
.
Ojala y se entienda. De antemano gracias
Me parece raro. Pues no debería pasar eso. He revisado los ejemplos y todo correcto. ¿Haz revisado la seccion ejemplos? . Si descargastes el ejemplo ten en cuenta que el archivo principal es empleados_actualizacion.php.
hola me gustaria que pusieras un ejemplo de validacion de campos con ajax. estaria muy bueno
Hola, esta muy bien tus ejemplos, aunque no lo e puesto en marcha, pero tambien sería bueno que los datos se pidieran por medio de un campo de texto html y php, es decir, un formulario de un solo campo por ejemplo:
campo ID: “aqui escribes la id del usuario”
haces click en el boton BUSCAR
RESULTADOS ID: “aqui se muestran los resultados del usuario correspondiente a la ID subiministrada en el campo ID”.
Ves que es buena idea?
Gracias, intentare hacerlo como te digo.
Hola, ya realize lo que les comente.. la empresa para la que trabajo me pidio que los trabajadores deberian estar registrador por su numero de identificacion “CEDULA DE IDENTIDAD”, entonces incorpore un buscador comun y corriente, solamente modifique para que buscara solo en el campo CEDULA de la base de datos, entonces al buscar un numero de cedula especifico me aparecen los datos, aqui incorpore los ejemplos de esta web y quedo todo perfecto.
Que bueno que el artículo halla sido útil. Pronto estaré publicando más sobre ajax.
¡muy wapo el tutorial! me ha venido de lujo, esta super bien explicado. mil gracias.
Por desgracia no os puedo enseñar el resultado ya que es para administrar un foro, solo lo ven los administradores.
Gracias otra vez y ya estais en mis favoritos, os leere muy a menudo.
salu2
QUE BUENO ESTA EL SITIO, A MI ME HA SERVIDO DE MUCHO, TODOS LOS EJEMPLOS, OJALA PUBLIQUEN MAS
BUEN DIA, CON UNA MOLESTIA, YO ESTUVE PROVANDO EL CODIGO, PARA ACTUALIZAR PERO ME DA ERROR SERA QUE ME PODRIAN AYUDAR, EL ERROR ES EL SIGUIENTE:
EN EL ARCHIVO CONSULTA_POR_ID
Warning: mysql_fetch_array(): supplied argument is not a valid MySQL result resource in C:Archivos de programaApache GroupApache2htdocsEDYPHPactualizacionconsulta_por_id.php on line 19
//muestra los datos consultados en los campos del formulario
GRACIAS. SI ME PUDIERAN MANDAR TAMBIEN A MI CORREO EDYUNI@GMAIL.COM
DE ANTEMANO MUY AGRADECIDO POR SU AYUDA
Hola harry.
Haber: ¿Cambiastes los datos para conexion a la base de datos? ó ¿Verificastes que la consulta sea la correcta? Recuerda qe la tabla se llama Empleados. Espero haber ayudado.
Hola, he probado el código para ver si se actualizaban los datos porque tengo ese problema, lo he probado y la página falla, cuando vas a modificar otravez el mismo empleado te salen los datos que tenia la primera vez que actualizaste. Sabes como solucionarlo? en IE no funciona bien, pero en firefox si. Alguna soución?
hola! Primero que todo, muy bueno el ejemplo. yo soy una novata en este tema y lo que pasa es que baje los codigos y los subi a mi servidor apache. Pero no sé como lo tengo que hacer con el archivo sql para que todo funcione…donde lo tengo que dejar?. Bueno tb tengo mysql con apache.
esop, espero se haya entendido mi duda.
Saludos!!
Hola kralito: Tiene razón existe un error en IE al actualizar los datos, estoy viendo una solución. Lo estaré informado.
Hola claudia: el archivo de sql tiene que ejecutarlo, puedes hacer uso del phpmyadmin o el mysqlquery, que es una aplicacion para ejecutar script sql. Aqui el enlace.
Saludos
Primero que todo quisiera filicitar el gran aportaso se agradece esta super buieno ejecute todo esta funcionando casi bien pero tengo el siguiente problema es que cuado realizo el click en Actualizar me actualiza los datos en la BD pero lamentablemente no se ejecuta el include include(“consulta.php”); como cargandoce solo aprace el msn que dice actualizacion con exito si puedes explicar por que razon se agracederia ya que solo me faltaria este pequeño detalle y estaria dandole para adelante con tuti yoani_maipu@hotmail.com
BUEN DIA, CON UNA MOLESTIA, YO AUN SIGO TENIENDO EL PROBLEMA DE QUE A LA HORA QUE QUIERO ACTUALIZAR NO ME HACE NINGUN CAMBIO, Y APARENTEMENTE YA NO ME MUESTRA NINGUN ERRO, EL QUE ME TIRABA ANTES ERA EN ESTO “”mysql_fetch_array””,
LES ESTARIA MUY AGRADECIDO SI ALGUIEN ME PUEDE AYUDAR.
DE ANTEMANO GRACIAS
Saludos Harry haber si te puedo ayudar en algo ami tambien me pasaba lo mismo y lo pude solucionar ahora bien tube que hacer un seguimiento te recomiendo en el php acualizacion.php antes de realizar el update publica las variable de esta forma para ver si estab pasando los datos por ejemplo
echo “Aqui mostrar datos 1)—>$idemp 2)—>$nom”; ejecuta esto primero si te funca ahi me envias tu sql para poder verlo si no muestra los datos te puedo enviar los que realice yo en todo caso tambien tengo un pequeño problem que cuando se actualiza no carga los datos nuievamente y tambien presento problemas con IE bye. yoani_maipu@hotmail.com
BUEN DIA, GRACIAS YOANI POR RESPONDER, FIJATE QUE YA HICE LO QUE ME SUGERIAS, PERO SIGUE SIN ACTUALIZARME, NO ME MUESTRA NINGUN ERROR PERO NO ME ACTUALIZA,
TE ESTARIA MUY AGRADECIDO SI ME ENVIARAS ALGO POR FAVOR
GRACIAS
Don HARRY buenas buenas aqui estoy leeyendo los tips pucha que lata que no te funque pero bueno buscando y buscando por ahi aplicando lo que aprendi desde aqui mas otras cositas logre hacer funcionar lo que se refiere a eliminacion, actualizacion y busqueda de datos y me funcionan todo bien tanto como Firefox y IE ahora bien no se si sera necesario subir aqui todo los programas realizados o bien comunicate por msn con migo y te envio los fuentes realizados si quieres y para el que decea puedo subir los fuentes estoy trabajando con postgres no hay mucha diferencia en si con mysql aqui mi correo yoani_maipu@hotmail.com hora de conexion 10:00 Am. hasta 18:30 Pm. Hora chilena bye
hola amigos esta interesante los ejemplos pero yo tambien me encuentro con el problema del archivo de actualizacion.php ya que actualiza pero no se refresca cuando escoges de nuevo el mismo ID espero ayudas mi correo es ruben2218@hotmail.com.
Hola de verdad que me gusto lo que hiciste ya que es un trabajo mas profesional….esta lindo….te felicito…pero tengo una duda…..tengo un proyecto en PHP es una galeria de imagenes con mysql…he buscado y probado los codigos que he encontrado en internet pero ninguno me ha funcionado….y cuando me marca errores no se que hacer…pues no conozco el codigo ¿de casualidad no tendras un codigo para insertar imagenes y texto? te lo agradeceria mucho…mi email es: janrry_2020@hotmail.com…………saludos y felicitaciones de nuevo….te quedo muy linda tu pagina bye
holas muy buenos los ejemplos pero tengo el mismo problema que muchos una ayudita para poder solucionarlo parece que no actualizara los datos al hacer la consulta realmente si lo actualiza en la base de datos pero al querer modificar nuevamente los datos te muestra los datos antriores en el formulario
Muy bueno,
lo entendi de una…
Hola Respecto al problema de EI en la parte de Actualizar con ajax y php Use el ejemplo de Aqui de tal manera que cuando mandas a llamar la funcion de pedirdatos en el archivo ajax lo cambias por el metodo POST a todos y con esto Lograras Poder Actualizar Bien en Internet Explorer ok Pueden contactarme si tienes Dudas
blancoerik@hotmail.com
Una pregunta al momento de ejecutar empledos_actualizacion me muestra la tabla pero al darle click en el id me sale un error aqui en el consulta_por_id
$idemp=$_POST[‘idemp’];
$sql=mysql_query(“SELECT * FROM empleados WHERE idempleado=$idemp”,$con) ;
$row = mysql_fetch_array($sql);
dice warning mysql_fetch_array suplied argument is not valid
entonces probe asi
$idemp=$_POST[‘idemp’];
$sql=mysql_query(“SELECT * FROM empleados WHERE idempleado=$idemp”,$con) or die(mysql_error());
$row = mysql_fetch_array($sql);
al momento de ejecutarlome sale un error de sql de sintaxis
You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near ” at line 1
Si me pudieran ayudar a resolver mi problema se lo agradeceria mucho
mi correo de gmail es yoshi.rage gracias
Hola Sobre Respecto a tu Error Tienes k Mover tu Archivo de ajax.js quedando la funcion de PedirDatos de la siguiente Manera
function pedirDatos(idempleado){
//donde se mostrará el formulario con los datos
divFormulario = document.getElementById(‘formulario’);
//instanciamos el objetoAjax
ajax=objetoAjax();
ajax.open(“POST”, “consulta_por_id.php?idemp=” idempleado);
ajax.open(“POST”, “consulta_por_id.php”,true);
ajax.onreadystatechange=function() {
if (ajax.readyState==4) {
//mostrar resultados en esta capa
divFormulario.innerHTML = ajax.responseText
//mostrar el formulario
divFormulario.style.display=”block”;
}
}
//como hacemos uso del metodo GET
ajax.setRequestHeader(“Content-Type”,”application/x-www-form-urlencoded”);
//colocamos null
ajax.send(“idemp=” idempleado)
}
pudiendo ve en al momento de llamare la pagina de consulta_por_id.php le quitaras el parametro idemp y le pongra la bandera de true y al momento de enviar los datos enviaras ahora si el parametro de idemp asi al momento de llegar el formulario de consulta_por_id lo llamas como tu lo llamas $idemp=$_POST[“idemp”]; con esto podras Corregir tu Problema.
muy buenos ejemplos prodrias hacer uno con imagenes en una base de datos (mysql) y tambien la consulta en php te lo agradeceria mucho
saludos
en firefox funciona, en IE no.
Respondiendo los 2 ultimos comentarios:
– 1º sería interesante trabajar con imagenes en una base de datos, escribire un tutorial al respecto.
– 2º ¿que no te funciona en IE jose? Por que hace poco resolvimos un error en el código para que funcione en IE.
Saludos
Hola, seria posible poder unificar parte del código mediante funciones en un mismo archivo?
Por ejemplo en el ajax se llama al archivo “ajax.open(“POST”, “consulta_por_id.php”);”
La cosa seria que en el mismo archivo empleados_actualizacion.php este ya el formulario de “consulta_por_id.php” metido dentro del
Hice varias pruebas fallidas trantando de que en “ajax.open(“POST”, “actualiza/consulta_por_id.php”);” se llame a una funcion php, por ejemplo “ajax.open(“POST”, “actualiza/consulta_por_id.php?sec=PideLosdatos
Por supuesto, que se puede unificar. Pero en el ejemplo separamos los archivos pues ha veces resulta util tener los procesos en diversos archivos y llamarlos (o incluirlos) cuando sea necesario.
Existen dos formas de llamar a un archivo mediante el ajax.
el metodo .open acepta dos valores:
GET y POST
Ejemplo:
ajax.open(“POST”, “actualiza/consulta_por_id.php”);
ajax.open(“GET”, “actualiza/consulta_por_id.php?var1=valor
hola la verdad es la primera vez que entro a esta pagina pues me pidieron que haga un programa en php que actualize los programas de una red que abarca un pequeño edificio. en realidad yono se programar en php y me gustari que me orientaran un poco. gracias
Hola cristina. Este articulo trata de PHP y MySQL y AJAX que es un poco mas avanzado, en ese caso te recomendaria que empieces conociendo PHP en este enlace hay un tutorial bien práctico y fácil de entender.
Espero te sea útil la información.
Hola Cristina Respecto a tu pregunta Yo te Puedo Dar un asesoria
ok te paso mi correo es blancoerik@hotmail.com
muy bueno el artículo, me ha servido muchisimo, pero me ha surgido la siguiente duda , en caso que yo quiera actualizar dos div al mismo tiempo, llamando a dos paginas distitnas, o sea , haciendo dos open en simultaneo, como se hace? he probado y no he llegado a ningún resultado exitoso
tendrias que crear dos instancias del objeto xmlhttprequest, no puedes usar solo una.
estos ejemplos de ajax…me han ayudado muchisimo..para realizar mejores manejos de informacion….pero tengo una duda….maneje el agregar y el eliminar en uno mismo..y quise agregar el de modificar…..pero yo lo queria hacer…que en la misma pantalla cuando seleccione el id..que se colocaran los datos en los cuadros de texto…pero en el ejmplo que vi de con ustedes…muestra el listado y en seguida al presionar sobre el id…manda a otra pantalla donde se podrá modificar….mi pregunta es alguien me pudiera asesorar para poder lograr que la modificacion y actualizacion de los registros se hiciera ahi mismo…..y excelente el manual que expudieson..sobre todo porque es practico…..
Hola srangel, lo que tratas de hacer es agregar las opciones de modificar y eliminar en la misma lista, verdad? lo que puedes hacer es crear dos links: modificar y eliminar a cada elemento de tu tabla, cada link realizará la accion correspondiente, coloca la función en el evento onclick y listo. Cualquier duda la puedes hacer.
Saludos
gracias por la ayuda que me dieron ..me ayudo muchisimo…pero ahora mi pregunta es .. como puedo verificar los datos que se le envian al ajax.js en la funcion correspondiente…..porque coloco alert lo que se maneja en javascript..y no me muestra el alert…me podrian ayudar..porque si me gustaria estar checando que es lo que entra de dtos a la funcion en el js….
Hola srangel, puedes verificar los datos haciendo uso de alert ( ) después de asignar los inputs a las variables: id, nom, dep, suel, de la función EnviarDatos(), por supuesto el resto del código lo comentas con /* … */ ya que tu objetivo es verificar los datos…. Saludos
La verdad es que el ejemplo tiene muy buena pinta, pero quisiera saber si existe alguna razón para que no me abra en cuanto pincho en el link de la ID de usuario, quizas sea que estoy algo ofuscado pero no le veo ninguna razón, miro en el onclick de consulta.php y el pedirDatos y no se me ocurre nada.
Saludos.
hola, lo q’ quiero sabar es como verificar un registro si esta o no en la base de datos porque el select * from (tabla) where (campo) like % ‘variable’ % lo busca pero si no esta, que hago como verifico eso en php.
me sirvio de mucho es ta ji na para hocer una tarea de phpmysql en lo que es la consulta de rejistros y la actualizacion gracias
Definitivamente maestro, muchas gracias.
Yo tengo el mismo problema que zin cuando pincho sobre el codigo no me realiza nada y eso que he probado con post y get pero no veo la razon ya se que onclick=”pedirDatos(.$row[‘idempleado’]. idempleado es el id de la tabla podria hacer algo diferente si por ejemplo fuera [id_user ] por ejemplo y cambio en la funcion perdiDatos (id_user) reo que asi es la logica del script pero alguna razon por la que no salga
mi recomendación es que usen firefox, prueben con la extensiones “firebug” para ver cual es problema, puede ser muchos: el archivo javascript, el php (quizas no envia los datos correspondientes), o puede ser una mala consulta a la base de datos mysql.
He reformado el codigo para una base de datos con tablas que me crea un formulario.
Cuando lo pruebo en Local me funciona perfectamente actualizando todo0 perfecto.
Cuando lo hago en server remoto no me actualiza la base de datos ni tampoco me da un error. He probado con el firefox y firebug y nada todo parece correcto.
La unica modificacion de los archivos de local a server es que le he metido los datos de la base de datos.
$bd_host = “localhost”;
$bd_usuario = “root”; aqui pongo mi usuario de mi BD
$bd_password = “”; aqui pongo mi contraseña de mi BD
$bd_base = “formulario”;
Amigos.
He seguido al pie de la letra los ejemplos, y me funcionan sin mayores inconvenientes el consultar y añadir un registro, incluso los puedo validar. El problema que tengo es al editar, ya que agregue mas campos a la tabla de la base de datos para probar, pero no me permite actualizar otros campos. Realizo la actualización para los campos del ejemplo y actualiza, pero al momento de cambiar el codigo para actualizar los otros campos (los que agregue) las variables quedan vacias y me actualiza los campos y los deja vacios.
Lo otro que hice fue cambiar el nombre de las variables del ejemplo editar para hacerlos mas concordantes con lo que estoy realizando, pero tampoco me actualiza.(notese que cambie tambien las variables en los otros ejemplos y si me funcionan)
¿Cual puede ser mi problema??
Gracias de antemano
Hola VICTOR VILAGRAN t tengo una solucion… para saber si no esta el campo en mi caso yo utilizo una variable ejemplo:
$variable=0;
busco el campo normalmente y si lo encuentro modifico la variable $variable=5;
al final de la consulta pregunto si $variable=0 para saber si sigue igual…si sigue igual me indica que no lo encontro… si tienen otra la pueden decir.. gracias
Hola, en mi caso tanto me funciona usando GET como POST en ambos navegadores, pero yo necesito otra aplicación que consiste en rellenar una select a partir de una base de datos, tengo dos selects, uno con provincias y otro con municipios. El objetivo consiste en rellenar la select de municipios dependiendo del valor selecionado en provincias. El codigo me funciona a la perfeccion en Firefox, pero en iExplorer no me carga la select. Sería correcto en el script php devolver: echo “”.htmlentities($name).””;
Muchas gracias!
Hola soy de Perú los codigos estan muy buenos espero que nos puedan seguir apoyando como lo viene hacienod gracias
Hola, oye esta super bien la opción que nos das pero yo tengo un problema no me esta actualizando la tabla aunque me dice que si se realizo el cambio ojala me pudieras ayudar con esto te lo agradezco mucho.
NOC’ xQ’ NO FUNCIONA YA MIRE TODO NOC’ EN Q’ PARTE ESTE EL ERROR LO ESTUVE MODIFICANDO PARA ADAPTARLO A MI PAGINA PERO NO SIRVE
LOS CAMPOS LOS CAMBIE X LOS DE LA BASE D’ DATOS MIA PERO NO SIRVE.
EL CARGA LOS DATOS PARA EMPEZAR A MODIFICARLOS CUANDO LE DOY ACTUALIZAR DICE’ Q’ SI LO ACTUALIZO CUANDO ENREALIDAD NO HISO NADA, NOC’ Q’ MAS HACER
GRACIAS POR CUALQUIER AYUDA
Gracias Amigo, Excelente los codigos. Era justo lo que requeria. Soy nuevo en esto de la programación pero es excelente.
Si puede echarme la manito en lo siguiente:
Tengo un select, necesito capturar el valor en una variable php, para luego hacer una consulta en una base de datos, ¿como la captura en la misma página?
Excelente explicacion, muchas gracias x compartir ese conocimiento!!!
Hola, soy de venezuela, baje el archivo que dice actualizado y y lo aplique a una base de datos que tengo solo agregue nuevo campos a los archivo el consulta.php me mmuesta mis datos, sin embargo cuando me coloco el el id de mis datos no sucede nada, no veo como consulta.php llama al ajax.js para usar la función pedirDatos. Me pueden ayudar
hola froilan lozada imprime tu variable echo $row[“idempleado”]; para ver que tienes si contiene algun id y fijarte que el idempleado debe estar definido en la consulta del select ok Saludos
Lo que me gustaria saber es que libreria utilizas para ajax, ya que he visto muchas. Por ahí me dijeron que prototype esta pasada de moda. La verdad es que quiero aprender a incorporar ajax en php, pero aun no decido que libreria puedo utilizar.
hola Zarina Fuentes pos yo no utilize ninguna pero puedes usar la de sajax que es buena pero puedes usar jquery con Mooltools incorporando ajax separado
Recién me adentré en AJAX y la verdad es que tus ejemplos me están ayudando bastante.
Pero no entiendo como podría hacer esto mismo pero con una tabla y utilizando checkbox :S
¿Podrías ayudarme?
Muy bueno el ejemplo, lo voy a modificar para aplicarlo a un sitio que estoy desarrollando.
Saludos!!!
Buenas tardes,
El aporte esta excelente, incluso lo he tomado para un sitio que esto desarrollando, pero tengo un inconveniente al momento de realizar la actualizacion.
Quien puedea ayudarme, aqui dejo mi correo: andreacs1982@gmail.com
Gracias
Muchas gracias! tu código me ha servidor de mucho
funciona perfecto (con la modificación) , me gustaria que cargue al final de nuevo la consulta
Hola que tal
disculpa pero tengo un problema con el codigo.
Me manda el siguiente error
Parse error: syntax error, unexpected T_STRING, expecting ‘,’ or ‘;’ in C:\AppServ\www\consulta.php on line 58
cuya linea tengo esto:
echo ”
“;
ojala me puedan ayudar.
de ante mano muchas gracias
la res puesta al amigo qu busca el resultado de este erros es que cuando imprimimos en php tenemos que omitir la comilla “” por ” o no ponerla
cuya linea tengo esto:
echo ”
“;
el resultado quedario haci
echo ”
“;
Sinceramente quiero agradecer su ayuda, despus de estar viendo cientos de sitios, ninguno explica los ejemplos como ustedes lo hacen, todos nada mas te avientan el codigo y a ver como le haces.
GRACIAS MIL y felicidades
Amigo en IE8 no me funciona, cambie GET por POST y nada. Estuve leyendo por ahi que es dado por un error el el objeto XmlHttpRequest(). Pero no doy con el clavo. En Chrome y Firefox funciona de pelos….
ola!!! saludos y agradecido
no puedo bajar el ejemplo asi q lo intente
asi creando los SCRITPS pero nu me funciona
la pagina CONSULTA.PHP me tira este error
Parse error: syntax error, unexpected T_STRING, expecting ‘,’ or ‘;’ in C:\AppServ\www\consulta.php on line 58
y ago las modificaciones de las “” pero tampoco funciona alguna ayuda???
ola!!! saludos y agradecido
no puedo bajar el ejemplo asi q lo intente
asi creando los SCRITPS pero nu me funciona
la pagina CONSULTA.PHP me tira este error
Parse error: syntax error, unexpected T_STRING, expecting ‘,’ or ‘;’ in C:\AppServ\www\consulta.php on line 58
y ago las modificaciones de las “” pero tampoco funciona alguna ayuda???
Link arreglado. Cualquier problema con los links avisarme.
saludos
En IE6 no me funcionaba, asi que reemplace con esta funcion que encontre en alguna página los innerHTML.
Cada divFormulario.innerHTML = ajax.responseText lo reemplace por divFormulario.innerHTML = ajax.responseText
Creo que no funciona cuando viene codigo html en el ajax.responseText (por lo menos a mi me fallaba en esos casos y funcionaba en el resto).
La funcion que encontre es la siguiente:
function replace_html(el, html) {
if( el ) {
var oldEl = (typeof el === “string” ? document.getElementById(el) : el);
var newEl = document.createElement(oldEl.nodeName);
// Preserve any properties we care about (id and class in this example)
newEl.id = oldEl.id;
newEl.className = oldEl.className;
//set the new HTML and insert back into the DOM
newEl.innerHTML = html;
if(oldEl.parentNode)
oldEl.parentNode.replaceChild(newEl, oldEl);
else
oldEl.innerHTML = html;
//return a reference to the new element in case we need it
return newEl;
}
};
La agregue al final del ajax.js.
Saludos
Hola!
Estoy aprendiendo PHP y me parece fabulsa la programacionde php con ajax, solo que me surgio un pequeño inconveniente, talves sea pura vanidad, pero quiero iluminar el renglon del empleado a modificar. Ya lo intente pero solo se ilumina en la plantilla o e el frame de la consulta.php (con ayuda de una funcion) No se como hacerle para que los renglones e vean iuminados en la platilla principal (empleados_actualizacion.php)
Si alguien puede ayudarme se los agradecere.
Atte: María
Hola muchachos de Ribosomatic, antes que nada gracias por los aportes que le dan a la sociedad.
Resulta que probé este ejemplo y me funcionan bien los archivos excepto el “consulta_por_id.php”, el cual me manda un error en la consulta.
Warning: mysql_fetch_array(): supplied argument is not a valid MySQL result resource in ….
Entonces he estado buscando, pero no es ningún problema de usuario, password o privilegios de usuario, ya que el otro ejemplo funciona perfecto.
y en la linea que marca el error es esta:
$row = mysql_fetch_array($sql);
entonces no se que este mal, me podrían echar una mano?
Gracias y saludos.
Si lo siento de netrada no habia entendido bien el ejemplo, ya lo entendi, gracias por el ejemplo.
Para el amigo eduardo el problema se resuelve cambiando las ” por ‘ quedando de esta manera
echo “
“;
Gracias por la ayuda.
Esto me parece bien, solo tengo una consulta. como puedo modificar la consulta de empleados de tal forma que me muestre en pantalla los nuevos registros que se han incluido, o sea, que sin tener que repetir la consulta, me muestre si hay registros nuevos en la tabla de empleados.
Lo he intentado con un refresh a la pagina cada 15 segundos, pero es molesto, pues la pantalla tiene un leve parpadeo. He leido que Ajax es ideal para esto.
Saludos
Hola Amigos.
El codigo anterior esta genial me ha funcionado muy bien pero tengo una gran duda como hago esto mismo pero enviando las filas de una tabla que se llena con un while. Ayudenme por favor lo he intentado de mil manera y no me funciona. estoy desesperada.
Gracias
Hola gracias por esta ayuda pero tras mirar el codigo mil veces no encuentro como haces para capturar el id haciendo clic, no veo ningun evento onclick.. ¿Podeis aclararlo? Gracias
a mi no me funciona cuando llama a la funcion pedirDatos, no me mete nada en la capa formulario
cuando el id tiene letras y numero no funciona
me crea la tabla con los empleados pero al darle clck al id no se ejcuta el onclick.. cual es el problema alguien ayudeme
hoa amigos yo tengo un problema a la hora de imprimir los datos me saca un error en el mysql_fetch_array(): supplied argument is not a valid MySQL result resource in
yo use este script
function showgenero(str){
if (str==””)
{
document.getElementById(‘listado’).innerHTML=””;
return;
}
if (window.XMLHttpRequest)
{
xmlhttp = new XMLHttpRequest();
}
else
{
xmlhttp = new ActiveXObject(“Microsoft.XMLHTTP”);
}
xmlhttp.onreadystatechange=function(){
if(xmlhttp.readyState ==4 && xmlhttp.status==200)
{
document.getElementById(“listado”).innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open(“GET”,”getuser.php?q=”+str,true);
xmlhttp.send();
}
pero la consulat solo fuciona una sola vez, luego imprime los mismos valores de la primera, y para que se actualiza tengo q borara los archivos temporales de internet, me puedes ayudar
muchisismas gracias
alusina que use POST como ponias en la correccion y no me funciono jajaja XD lo deje con GET y si corre en IE 9
Hola pues tambien estaba intentando descubrir porque no sale:
pasa lo siguiente: en ajax.js donde dice:
en el Metodo enviarDatosEmpleado(){
…
divFormulario.innerHTML = “
La actualización se realizó correctamente
“;
…}
bueno debe ser asi:
divFormulario.innerHTML=”
La actualizacion se realizo correctamente
“;
Notese el detalle de la barra invertida , esto sirbe para considerar a las (“”) como si fuera parte de lo que se esta asignado.Cambie eso y funciono.
Lo mismo sucede en consulta_por_id.php
Está asi:
echo “”.$dep.””
Debería ser así:
echo “”.$dep.””;
Saludos y gracias por compartir el codigo es muy util.
Gracias de antemano, mi pregunta es; Como reemplazar mysql_fetch_array(int), en caso de tener un id a consultar alfanumerico, pues la funcion no es valida en este caso y no existe funcion alguna que convierta string a int, AYUDAAAAAAAAAAA
CORRECCIÓN EN EL ARCHIVO CONSULTA.PHP
Un error de comillas en la línea de codigo correspondiente al link pedirDatos.
<?php
while($row = mysql_fetch_array($sql)){
echo "
//mediante el evento onclick llamaremos a la funcion PedirDatos(), la cual tiene como parametro
//de entrada el ID del empleado
?>
<?php
echo "
“;
echo ”
“;
echo ”
“;
echo ”
“;
}
?>
Muy buena la web. Me es de mucha utilidad este ejemplo. Gracias.
que tengo que cambiar para poder actualizar dependiendo si cumple ciertos criterios por ejemplo
UPDATE empleados SET sueldo=’$sueldo’ WHERE id_empleado=’$id_empleado’ AND departamento=’$departamento’
pruebo la consulta en la consola de php y si lo realiza pero en el ejemplo solamente se queda en que se actualizo correcto y no lo hace saludos
hola quise descargar el zip pero el url ya no existe, y tampoco el de el ejemplo para ver como trabaja la aplicacion, no se si pueden activar de nuevo los links, o comopuedo conseguir el archivo zip?? Gracias, Saludos!!
Espectacular, solo falta mejorarlo un poco para que se actualice unicamente el registro seleccionado y no todos los resultados. ¿Alguien aporta algo? Personalmente no entiendo como hacer para marcar todas las opciones en el archivo .jx
las descargas de este ejemplo, no estan disponibles, las necesito, favor de incorporarlas nuevamente. Gracias!!
funciona todo bien pero en internet explorer no funciona me da un error
SCRIPT58734: Error del sistema: -1072896658.
y la linea es
divFormulario.innerHTML = ajax.responseText;
El código no funciona da errores
Excelentes ejemplos y enseñanzas. He probado todos los ejemplos dados y funcionan perfectamente. Conocia casi nada de javascript, pero ahora se algo y lo entiendo, gracias a estos ejemplos. Felicitaciones Jesus. He aprendido contigo mas que ir a un instituto horas y horas. Simplemente analizando tus ejemplos y probandolos, haciendo algunos cambios para adecuarlo a mis necesidades y elaborando programas.
Gracias