Hola! El código usado en este tutorial aquí tiene funciones obsoletas. La estructura y lógica te pueden servir, pero nada más. Te invito a ver una publicación actualizada sobre CRUD con PHP y MySQL, HTML y JavaScript en el frontend.
Jesus Liñan
En tutoriales anteriores explicabamos como combinar los lenguajes de servidor PHP y el gestor de base de datos MySQL con el objeto XMLHttpRequest (lo que hace posible AJAX) para llamadas asíncronas. Sin embargo hacer uso de manera tradicional de este objeto JavaScript es muy engorroso a la hora de codificar. Justamente la librerías JavaScript actuales han simplificado el trabajo. Es allí donde nos centraremos ahora. Haremos uso de la librería (que ha mi parecer es muy cómoda de usar) jQuery.
Vamos a realizar un pequeño mantenimiento de datos de unos clientes, esto nos permitirá visualizar, agregar, modificar ó eliminar sus datos. Cómo siempre haremos uso de MySQL y PHP pues es la forma de probarlo en mi servidor web. La explicación que daré será de manera general (no entrare en muchos detalles), así que en los comentarios pueden plasmar sus dudas si lo desean. También quiero aclarar que no soy un experto en el uso de jQuery, solo sé algo de lo poco que leí de jQuery in Action, así que quizás en el código vaya a pecar de ignorante. Pero si tiene alguna crítica, espero lo hagan con la actituda adecuada.
Empecemos entonces con la tabla cliente, que tiene la siguiente estructura:
CREATE TABLE `cliente` ( `id` tinyint(7) NOT NULL, `nombres` varchar(50) NOT NULL, `ciudad` varchar(50) NOT NULL, `sexo` char(1) NOT NULL, `telefono` varchar(10) NOT NULL, `fecha_nacimiento` datetime NOT NULL ) ENGINE=MyISAM DEFAULT CHARSET=latin1; ALTER TABLE `cliente` ADD KEY `id` (`id`); ALTER TABLE `cliente` MODIFY `id` tinyint(7) NOT NULL AUTO_INCREMENT; COMMIT;
Vamos a crear dos clases en PHP: 1) para la conexión con el servidor y 2) una clase cliente, con cinco métodos básicos.
conexion.class.php
<?php
class
DBManager
{
var $conect;
var $BaseDatos;
var $Servidor;
var $Usuario;
var $Clave;
function DBManager()
{
$this->BaseDatos = "base-datos";
$this->Servidor = "localhost";
$this->Usuario = "user";
$this->Clave = "pwd";
}
function conectar()
{
if (!($con = @mysql_connect($this->Servidor, $this->Usuario, $this->Clave))) {
echo "<h1> [:(] Error al conectar a la base de datos</h1>";
exit();
}
if (!@mysql_select_db($this->BaseDatos, $con)) {
echo "<h1> [:(] Error al seleccionar la base de datos</h1>";
exit();
}
$this->conect = $con;
return true;
}
}
cliente.class.php
<?php
include_once("conexion.class.php");
class Cliente
{
//constructor
var $con;
function Cliente()
{
$this->con = new DBManager;
}
function insertar($campos)
{
if ($this->con->conectar() == true) {
return mysql_query("INSERT INTO cliente (nombres, ciudad, sexo, telefono, fecha_nacimiento) VALUES ('" . $campos[0] . "', '" . $campos[1] . "','" . $campos[2] . "','" . $campos[3] . "','" . $campos[4] . "')");
}
}
function actualizar($campos, $id)
{
if ($this->con->conectar() == true) {
return mysql_query("UPDATE cliente SET nombres = '" . $campos[0] . "', ciudad = '" . $campos[1] . "', sexo = '" . $campos[2] . "', telefono = '" . $campos[3] . "', fecha_nacimiento = '" . $campos[4] . "' WHERE id = " . $id);
}
}
function mostrar_cliente($id)
{
if ($this->con->conectar() == true) {
return mysql_query("SELECT * FROM cliente WHERE id=" . $id);
}
}
function mostrar_clientes()
{
if ($this->con->conectar() == true) {
return mysql_query("SELECT * FROM cliente ORDER BY id DESC");
}
}
function eliminar($id)
{
if ($this->con->conectar() == true) {
return mysql_query("DELETE FROM cliente WHERE id=" . $id);
}
}
}
Los procesos básicos de un mantenimiento de datos los he separado en cada archivo: consulta.php, nuevo.php, actualizar.php, eliminar.php.
consulta.php
Este archivo se encarga de mostrar todos los clientes de la tabla, contienen un enlace a nuevo.php para agregar un nuevo cliente, además contiene dos enlaces para modificar y eliminar que enlazarán a los archivos actualizar.php y eliminar.php respectivamente, con sus variables GET (Ej. actualizar.php?id=40). También colocamos algo de JavaScript para estos dos enlaces.
<?php
require('clases/cliente.class.php');
$objCliente = new Cliente;
$consulta = $objCliente->mostrar_clientes();
?>
<script type="text/javascript">
$(document).ready(function() {
// mostrar formulario de actualizar datos
$("table tr .modi a").click(function() {
$('#tabla').hide();
$("#formulario").show();
$.ajax({
url: this.href,
type: "GET",
success: function(datos) {
$("#formulario").html(datos);
}
});
return false;
});
// llamar a formulario nuevo
$("#nuevo a").click(function() {
$("#formulario").show();
$("#tabla").hide();
$.ajax({
type: "GET",
url: 'nuevo.php',
success: function(datos) {
$("#formulario").html(datos);
}
});
return false;
});
});
</script>
<span id="nuevo"><a href="nuevo.php"><img src="img/add.png" alt="Agregar dato" /></a></span>
<table>
<tr>
<th>Nombres</th>
<th>Ciudad</th>
<th>Sexo</th>
<th>Telefono</th>
<th>Fecha Nacimiento</th>
<th></th>
<th></th>
</tr>
<?php
if ($consulta) {
while ($cliente = mysql_fetch_array($consulta)) { ?> <tr id="fila-<?php echo $cliente['id'] ?>">
<td><?php echo $cliente['nombres'] ?></td>
<td><?php echo $cliente['ciudad'] ?></td>
<td><?php echo $cliente['sexo'] ?></td>
<td><?php echo $cliente['telefono'] ?></td>
<td><?php echo $cliente['fecha_nacimiento'] ?></td>
<td><span class="modi"><a href="actualizar.php?id=<?php echo $cliente['id'] ?>"><img src="img/database_edit.png" title="Editar" alt="Editar" /></a></span></td>
<td><span class="dele"><a onClick="EliminarDato(<?php echo $cliente['id'] ?>); return false" href="eliminar.php?id=<?php echo $cliente['id'] ?>"><img src="img/delete.png" title="Eliminar" alt="Eliminar" /></a></span></td>
</tr>
<?php
}
}
?>
</table>
nuevo.php
Este archivo muestra un formulario donde escribiremos los datos del nuevo cliente, pero también actual cómo un proceso para agregar el cliente a la base de datos. Es por eso que primero evalua si existen definidas alguna variable POST. Si es así llama a la clase cliente y hace uso del método insertar. En la parte del formulario, en el evento onsubmit, llamamos a la función en JavaScript: GrabarDatos().
<?php require('functions.php');
if (isset($_POST['submit'])) {
require('clases/cliente.class.php');
$nombres = htmlspecialchars(trim($_POST['nombres']));
$ciudad = htmlspecialchars(trim($_POST['ciudad']));
$sexo = htmlspecialchars(trim($_POST['alternativas']));
$telefono = htmlspecialchars(trim($_POST['telefono']));
$fecha_nacimiento = htmlspecialchars(trim($_POST['fecha_nacimiento']));
$objCliente = new Cliente;
if ($objCliente->insertar(array($nombres, $ciudad, $sexo, $telefono, $fecha_nacimiento)) == true) {
echo 'Datos guardados';
} else {
echo 'Se produjo un error. Intente nuevamente';
}
} else {
?>
<form id="frmClienteNuevo" name="frmClienteNuevo" method="post" action="nuevo.php" onsubmit="GrabarDatos(); return false">
<p><label>Nombres<br /> <input class="text" type="text" name="nombres" id="nombres" /> </label> </p>
<p> <label>Ciudad<br /> <input class="text" type="text" name="ciudad" id="ciudad" /> </label> </p>
<p> <label> <input type="radio" name="alternativas" id="masculino" value="M" /> Masculino</label> <label> <input type="radio" name="alternativas" id="femenino" value="F" /> Femenino</label> </p>
<p> <label>Telefono<br /> <input class="text" type="text" name="telefono" id="telefono" /> </label> </p>
<p> <label>Fecha Nacimiento <a onclick="show_calendar()" style="cursor: pointer;"> <small>(calendario)</small> </a><br /> <input readonly="readonly" class="text" type="text" name="fecha_nacimiento" id="fecha_nacimiento" value="<?php echo date("Y-m-j") ?>" />
<div id="calendario" style="display:none;"><?php calendar_html() ?></div>
</label> </p>
<p> <input type="submit" name="submit" id="button" value="Enviar" /> <label></label> <input type="button" class="cancelar" name="cancelar" id="cancelar" value="Cancelar" onclick="Cancelar()" /> </p>
</form>
<?php
} ?>
actualizar.php
Este archivo, similar a nuevo.php, muestra un formulario con los datos del cliente seleccionado, pero también actual cómo un proceso para modificar los datos del cliente. Es por eso que primero evalua si existen definidas alguna variable POST. Si es así llama a la clase cliente y hace uso del método actualizar. En la parte del formulario, en el evento onsubmit, llamamos a la función en JavaScript: ActualizarDatos().
<?php require('functions.php');
if (isset($_POST['submit'])) {
require('clases/cliente.class.php');
$objCliente = new Cliente;
$cliente_id = htmlspecialchars(trim($_POST['cliente_id']));
$nombres = htmlspecialchars(trim($_POST['nombres']));
$ciudad = htmlspecialchars(trim($_POST['ciudad']));
$sexo = htmlspecialchars(trim($_POST['alternativas']));
$telefono = htmlspecialchars(trim($_POST['telefono']));
$fecha_nacimiento = htmlspecialchars(trim($_POST['fecha_nacimiento']));
if ($objCliente->actualizar(array($nombres, $ciudad, $sexo, $telefono, $fecha_nacimiento), $cliente_id) == true) {
echo 'Datos guardados';
} else {
echo 'Se produjo un error. Intente nuevamente';
}
} else {
if (isset($_GET['id'])) {
require('clases/cliente.class.php');
$objCliente = new Cliente;
$consulta = $objCliente->mostrar_cliente($_GET['id']);
$cliente = mysql_fetch_array($consulta); ?> <form id="frmClienteActualizar" name="frmClienteActualizar" method="post" action="actualizar.php" onsubmit="ActualizarDatos(); return false"> <input type="hidden" name="cliente_id" id="cliente_id" value="<?php echo $cliente['id'] ?>" />
<p> <label>Nombres<br /> <input class="text" type="text" name="nombres" id="nombres" value="<?php echo $cliente['nombres'] ?>" /> </label> </p>
<p> <label>Ciudad<br /> <input class="text" type="text" name="ciudad" id="ciudad" value="<?php echo $cliente['ciudad'] ?>" /> </label> </p>
<p> <label> <input type="radio" name="alternativas" id="masculino" value="M" <?php if ($cliente['sexo'] == "M") echo "checked=\"checked\"" ?> /> Masculino</label> <label> <input type="radio" name="alternativas" id="femenino" value="F" <?php if ($cliente['sexo'] == "F") echo "checked=\"checked\"" ?> /> Femenino</label> </p>
<p> <label>Telefono<br /> <input class="text" type="text" name="telefono" id="telefono" value="<?php echo $cliente['telefono'] ?>" /> </label> </p>
<p> <label>Fecha Nacimiento <a onclick="show_calendar()" style="cursor: pointer;"><small>(calendario)</small></a><br /> <input readonly="readonly" class="text" type="text" name="fecha_nacimiento" id="fecha_nacimiento" value="<?php echo $cliente['fecha_nacimiento'] ?>" />
<div id="calendario" style="display:none;"><?php calendar_html() ?></div>
</label> </p>
<p> <input type="submit" name="submit" id="button" value="Enviar" /> <label></label> <input type="button" name="cancelar" id="cancelar" value="Cancelar" onclick="Cancelar()" /> </p>
</form>
<?php
}
} ?>
eliminar.php
Este archivo, como su nombre lo indica, se encarga de borrar los datos del cliente especificado.
<?php
require('clases/cliente.class.php');
$cliente_id = $_GET['id'];
$objCliente = new Cliente;
if ($objCliente->eliminar($cliente_id) == true) {
echo "Registro eliminado correctamente";
} else {
echo "Ocurrio un error";
}
Ahora veamos las funciones en JavaScript relacionadas con los procesos PHP que acabamos de explicar de manera general.
jQuery.functions.js
Las cuatro funciones ActualizarDatos(), ConsultaDatos(), EliminaDato() y GrabarDatos(), hacen llamadas AJAX, mediante la función $.ajax({…}) que nos proporciona jQuery. Cada función hace una llamada a los procesos en PHP respectivamente.
function ActualizarDatos() {
var cliente_id = $('#cliente_id').attr('value');
var nombres = $('#nombres').attr('value');
var ciudad = $('#ciudad').attr('value');
var alternativas = $("input[@name='alternativas']:checked").attr("value");
var telefono = $("#telefono").attr("value");
var fecha_nacimiento = $("#fecha_nacimiento").attr("value");
$.ajax({
url: 'actualizar.php',
type: "POST",
data: "submit=&nombres=" + nombres + "&ciudad=" + ciudad + "&alternativas=" + alternativas + "&telefono=" + telefono + "&fecha_nacimiento=" + fecha_nacimiento + "&cliente_id=" + cliente_id,
success: function (datos) {
alert(datos);
ConsultaDatos();
$("#formulario").hide();
$("#tabla").show();
}
});
return false;
}
function ConsultaDatos() {
$.ajax({
url: 'consulta.php',
cache: false,
type: "GET",
success: function (datos) {
$("#tabla").html(datos);
}
});
}
function EliminarDato(cliente_id) {
var msg = confirm("Desea eliminar este dato?")
if (msg) {
$.ajax({
url: 'eliminar.php',
type: "GET",
data: "id=" + cliente_id,
success: function (datos) {
alert(datos);
$("#fila-" + cliente_id).remove();
}
});
}
return false;
}
function GrabarDatos() {
var nombres = $('#nombres').attr('value');
var ciudad = $('#ciudad').attr('value');
var alternativas = $("input[@name='alternativas']:checked").attr("value");
var telefono = $("#telefono").attr("value");
var fecha_nacimiento = $("#fecha_nacimiento").attr("value");
$.ajax({
url: 'nuevo.php',
type: "POST",
data: "submit=&nombres=" + nombres + "&ciudad=" + ciudad + "&alternativas=" + alternativas + "&telefono=" + telefono + "&fecha_nacimiento=" + fecha_nacimiento,
success: function (datos) {
ConsultaDatos();
alert(datos);
$("#formulario").hide();
$("#tabla").show();
}
});
return false;
}
//esta funcion es para el boton cancelar del form
function Cancelar() {
$("#formulario").hide();
$("#tabla").show();
return false;
}
index.php
Finalmente todo esto aparecerá en nuestro archivo principal index.php, que tendrá la siguiente estructura:
<!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>Mantenimiento de Clientes</title>
<script src="js/jquery-1.3.1.min.js" type="text/javascript"></script>
<script src="js/jquery.functions.js" type="text/javascript"></script>
<link type="text/css" rel="stylesheet" href="css/estilo.css" />
</head>
<body>
<div id="contenedor">
<div id="formulario" style="display:none;"> </div>
<div id="tabla">
<?php include('consulta.php') ?>
</div>
</div> <span style="text-align:center;width:300px;margin:auto;display:block;margin-top:20px;">RibosoMatic.com</span>
</body>
</html>
Hemos explicado el funcionamiento en general que tiene nuestra aplicación web, sin entrar en tantos detalles. Si tienes alguna duda escribe un comentario. Puedes descargar el demo con algunos arreglos, como CSS y un calendario en el formulario.
Update: 01.03.10
- Corregido problema con caché en IE 8.
me pareció muy bueno. Buen trabajo.
y si quiesiera paginar el resultado ?, tiene alguna opcion esta libreria?
muy bueno el aporte.
saludos.
hola de nuevo. cuando doy ene l boton editar y quiero editar la fecha de nacimiento del usuario, no me muestra el datapicker (calendario).
saludos.
estuve revisando de neuvo y si me muestra el calendario al momento de editar los datos. un lapsus.
gracias y disculpe por no revisar bien el script.
Hay un lapso entre que se consulta y recibe data del servidor. Eso se puede arreglar con un mensaje ó una imagen de carga. Saludos…
Saludos.
Es obligatorio usar clases?
o puede hacerse con funciones de igual forma?
Todavía no aprendo muy bien de clases y no quiero complicarme el doble..
SIlla!
hola quisiera saber porque no me funciona el link de descarga!!!! por favor si me pueden enviar de donde puedo bajar les agradeceria!!!!
haaaa una consulta en los codigo ejemplo en nuevo.php a que se refiere en require(‘functions.php’); o sea cual de los ejemplos es el functions.php si me ayudan a entender estare agradecidisima!!! muuuuy buen aporte por cierto!!! existos.. un abraso….=)
@Scyfox: No es obligatorio usar clases. Solo es una buena practica para reutilizar codigo. El archivo cliente.class.php lo puedes cambiar por funciones, no hay problema.
@ceci: El link de descarga si funciona: http://www.box.net/shared/u1ofhijbhf. Y donde dice require(funcions.php) es para llamar o referir codigo en otro archivo. functions.php no esta incluido en el tutorial pero si en el .zip. Contiene un calendario para seleccionar la fecha.
@jonathan: En el blog existe un tutorial sobre como paginar resultados con AJAX, PHP. En la sección AJAX está.
Saludos y gracias por su apoyo.
cuando se crea un nuevo registro y regresa a la pantalla inicial no aparece el nuevo registro.
supongo sera problema de un temporal
como se soluciona eso?
Excelente tutorial de inicio para el uso de JQuery
Saludos cordiales
hola tengo un problema que cuando guardo un dato no me muestra el aviso en una ventana solo me lo muestra como una pagina aparte y tengo que volver y actualizar para ver el nuevo registro que puede ser?
Muy bueno, le he probado y me gusta mucho como funciona.
El código es menos engorros que php-mysql. Me gusta jquery
excelente para entrar al mundo de ajax, muy didactico y ordenado.. .gracias
Me parece un exelente aporte, saludos
Buen aporte.
aplicaciones web
El ejemplo esta muy bien, pero tiene fallos y no funciona bien. Solo deja hacer una acción(añadir,elminiar,etc) y luego da error.
hola , me parece genial tu trabajo eh buscado
por separado estas 4 acciones para el mantenimiento
de una tabla pero no eh encontrado nada mejor q este ejemplo q la verdad esta bastante completo , probando me di cuenta que el reporte no esta paginado
trate de impletar otro ejemplo de paginado de esta web pero me da problemas a la hora de cambiar de pagina cuando uso los links de editar o borrar ya no
funciona igual , podrias subir un ejemplo de paginado
con jquery? , saludos = )
ya logre resolverlo , solo cambie la funcion de la libreria ajax.js del ejemplo del paginador a una funcion de ajax de jquery , fue mas sencillo de lo que pense , solo es de mandar el parametro con la funcion y el php dentro de consulta.php se encarga de todo , saludos
Que bueno saber que los tutoriales les sirvan. Eso es una motivación para seguir con el blog.
Saludos 😉
Hola! Que excelente ejemplo, soy nueva usando php y no tuve ningún problema al aplicarlo, sumamente claro de entender.
Solo tengo una duda ¿Existe alguna manera de paginearlo?
Por su ayuda muy agradecida SLDS
Hola, alguien porfavor me podría mandar la forma para paginearlo, ya que soy princpipeante y no lo e podido hacer…
de antemano gracias
Para paginación de resultado de una consulta, probad con esto:
https://www.www.ribosomatic.com/articulos/paginar-consultas-con-mysql-php-y-ajax/
En el archivo nuevo.php pone: require(‘functions.php’);
pero este archivo no está!!!
Me puedes dar una solución?
Muchas gracias, muy buen aporte!
@joan:
El archivo functions.php esta incluido en el .zip, incluye una función para mostrar un calendario en PHP. Saludos
weon la cagaste excelente aporte
una consulta..tienes algun ejemplo de sesiones para php pero que funke 😀 he probado miles pero todos colapsan.
No lo había visto!
Enhorabuena, es el primer ejemplo que me bajo y funciona a la primera, MUCHAS GRACIAS!
EXCELENTE!!!
ME gustaria saber si exite algun ejemplo con motools
muy buen aporte gracias….
tu ejemplo esta beuno, pero no entiendo pq se tiene que reembiar tanto las varibales cojiendo el archivo nuevo las varibles
$radicado = html_char($_POST[‘radicado’]);
$fkempresa = html_char($_POST[‘fkempresa’]);
$titulo = html_char($_POST[‘titulo’]);
$actividad = html_char(trim($_POST[‘actividad’]);
$fecha_reporte = html_char($_POST[‘fecha_reporte’]);
$objCliente=new Cliente;
if ( $objCliente->insertar(array($radicado,$fkempresa,$titulo,$actividad,$fecha_reporte)) == true){
echo ‘Reporte Guardado..’;
}else{
echo ‘Se produjo un error. Intente nuevamente ok’;
}
aparentemente se envia directamen las variables a la clase cliente.class.php en su funcion de insertar pero a su ves hace un llamado en metodo del formulario
action=”nuevo.php” onsubmit=”GrabarDatos(); pero condisionandolo en evento onsubmit para que se ejecute el jquery.functions.js en donde a su ves tiene una funcion llamada GrabarDatos() que a su vez re envia las variables de nuevo al archivo nuevo.php
@galax:
Al parecer esa linea es redundante. Pero no es así, ya que cumple un objetivo: si JavaScript esta desactivado en el navegador de todas formas funciona el ejemplo. Considerando esta línea:
action=”nuevo.php” onsubmit=”GrabarDatos()”
Empezará la ejecución de JavaScript osea la funcion GrabarDatos del evento onsubmit, la cual hace aparecer el formulario de registro nuevo.php para un nuevo dato; pero si JavaScript esta desactivado entonces se cargara la pagina nuevo.php para ingresar los datos.
Saludos 🙂
Hola sabes que me sirvio mucho esto. y pues lo estoy usando para hacer un sistema.
La idea central es genial muy simple. pero tube algunas complicaciones en lo referente a la programacion con jquery.
Bueno queria hacer mi aporte y tengo implementada la paginacion con Jquery y es muy simple asi que para no dejar el codigo aqui en un comentario pido si alguien me puede dar el correo para poder mandarles el codigo :P. Bueno eso seria Gracias nuevamente por tremendo blog
mmmm jesus no lo habia visto desde ese punto de vista, gracias por tu aporte igual, estoy haciendo un sistema para crear reportes diarios que me solicitaron en la empresa apenas termine espero compartir el ejemplo basado en este script y pues esperare comentarios…
Hola buenas tardes, necesito ayuda,
estoy haciendo residencia o estadia profesional y
el proyecto es hacer un herbario,
el problema es que es php orientado a objetos,
y la verdad el tiempo se me esta llendo en sima,
alguno de los usuarios este foro, podra ayudarme’
Eh estado checado varios libros, pero a un no tengo los conocimientos necesarios para desarrollarlo,
mi correo es gci3@hotmail.com.
espero su respuesta
No entendi
cada vez hay que saber más cosas para programar… primero html.. como te quedas cortina weno.. seguis con CSS,, luego queres algo dinámico.. le metés javascript.. para cuando queres conectarlo a la base de datos te das cuenta k no sabes nada de programación.. y le empezas a mirar de re ojo a php..
weno hasta acá llegué decis… para cuando eso ya sale xhtml, css 2 y monton de librerias javascript como mootools, jquery y prototype.. que te lleva a preguntar para qué empecé todo esto si no lo voy a poder terminar..
luego viene lo lindo… mejor dicho .. la factura de luz, agua , telefono… y te preguntás qué coño estuve haciendo durante todo este tiempo??
HOla, pues probe el codigo en fire fox y va de lujo, peor en internet explorer tiene un problema, al agregar o modificar un registro da problema a la hora de mostrar la tabla con la nueva información, pareciera que muestra una tabla que quedo en memoria (mostrando registros que hasta quizas ya se eliminaron) supongo que es problema de ajax, alguna solicion?
Hola,
antes de nada, felicitarte por tu buen trabajo.
y mi pregunta es la siguiente: es factible usando la función CargaDatos() añadirle un preload?
si es así, como seria?
si se puede agregar el preload solo debes crear una funcion de esta forma
Cargando...');}
function cargando(){
$("#cargandoo").html('
y llamala con una de las opciones que tiene $ajax.. que se llama “beforeSend”
Si y otro orientado a objetos que conbinados me de como resultado algo que3 me los ponga a corrrer en localhost alguien que sepa mi correo es arle_kin@hotmail.es 3013528742 Gracias
hola la verdad soy nuevo php, podrias ayudarme con la intalacion del mantenedor porque cuando presiono f12 me sale el siguiente erro:
Advertencia: Se esperó nombre de atributo o espacio de nombre pero se encontró ‘@name’.
Código Fuente: http://localhost/index.php
Linea: 0
no se como lo hago porfavor necesito ayuda gracias
Para usar un preload.. o cargando
Revisen esta libreria. Muy practica y simple de usar
http://malsup.com/jquery/block/#demos
Hola amigo, agradezco tu ejemoplo, me ha servido mucho, te felicito.
Me podrías ayudar, tengo un error al actualizar los datos, me sale este Warning.ç
Warning: Missing argument 2 for Cliente::actualizar(), called in C:AppServwwwclientesactualizar.php on line 18 and defined in C:AppServwwwclientesclasescliente.class.php on line 17
Lo he adaptado con mis datos.
Este error he buscado en google, pero no encuentro solución.
Disculpa las molestias y muchas gracias!
@Sandrillo
Revisa los parametros que envias al método actualizar. Recuerda que son dos parametros, un array con los campos y el id, verifica que estén definidos, sino seguirá apareciendo el error.
Saludos
Muy bueno tu aporte, estoy realizando algunas modificaciones para un proyecto que tengo, me ha servido de mucho, GRACIAS
Galax, tengo un proyecto muy similar al tuyo, quisiera saber si podríamos compartir algunas ideas
hola esta super bueno pero no me resulta con postgresql en vez de mysql
si podrias ayudarme
gracias
Bueno es excelente tu trabajo,
y muy interesante
gracias por la descarga… ^_^
Muy buen trabajo, sin embargo, una sugerencia seria que tuviera validaciones, asi como los otros ejemplos, la vdd soy nuevo en esto… sin embargo excelente trabajo….
Que excelente aporte, muchas gracias
Hola excelente tu trabajo lo he probado en firefox y todo bien pero tengo una duda sobre el navegador IE ya que cuando agrego un nuevo cliente no carga todos los datos agregados solo me muestra el primer cliente que agregue pero todo cambia cuando le doy f5 , ahi recien me muestra todos los clientes sabes que puedo hacer para no darle f5? gracias por todo y Felicitaciones 😀
Modifique el codigo para adaptarlo a un sistema de gestion de promociones.
Mi problema es que, a los dos ultimos campos quiero habilitarles el calendario. Ya que serian la fecha de inicio y de finalizacion de las promociones.
Para ello, duplique los campos en actualizacion y nuevo. Y duplique las funciones en functions y jquery.functions.js . Tanto a las funciones duplicadas como a las variables les agregue un 2 para diferenciarlas, asi tambien como a los div, etc.
Mi problema es que ahora no me funcionan los calendarios, al hacer click en un dia especifico en el calendario 2, me guarda la modificacion en el calendario 1, pero con otra fecha.
espero puedan darme una mano.
Si pudiese paginar, filtrar y ordenar columnas como el plugin datatable de JQUERY sería fantastico. Por lo que he leido algunos de este foro lo han conseguido con el ejemplo webapp.zip ¿alguien nos ayuda?
Gracias
Otra consulta. Se pueden guarda, y mostrar los datos de los campos respetando mayusculas y minusculas?
Saludos.
Muy bueno, pero seria bueno solucionaras el error de no mostrar la actualizacion o el agregar los datos de una persona en IE
bueno lo probe me parece exelente este ejemplo…
Esto esta de lujo, gracias por el aporte.
Pero alguien a podido resolver xq no actualiza los datos despues de un insertar o actualizar???
saludos y gracias.
Woow! todo muy bien explicado y esta genial, es de gran ayuda, pero he leido que en mozilla funciona perfectamente y en IE no, nadie ha dado una respuesta por que no funciona, espero alguien sepa y conteste esta interrogante.
Saludos.
Ok! El problema tiene que ver con los datos en cache del archivo consulta.php. Firefox carga por lo general las modificaciones recientes de una pagina web. Pero parece que IE7 y IE8 carga los datos guardados en cache. Es por eso que cuando le dan en guardar o actualizar muestra los datos de consulta.php que mostró cuando accedieron inicialmente a la aplicacion.
Es se corrige consultando la documentación de jQuery sobre la configuración de peticiones Ajax: http://api.jquery.com/jQuery.ajax/
Lo que hay que hacer es modificar el archivo jquery.functions.js en la funcion ConsultaDatos, y escribir la opción del objeto ajax: cache, en false.
De esta forma se fuerza a la pagina requerida (en este caso consulta.php) no almacenarse en la cache del navegador.
Finalmente quedaria asi:
function ConsultaDatos(){
$.ajax({
url: ‘consulta.php’,
cache: false,
type: “GET”,
success: function(datos){
$(“#tabla”).html(datos);
}
});
}
En tal caso tengo que corregir el articulo y el comprimido.
Saludos y mil disculpas por contestar muy tarde.
Excelente aporte y gracias por solucionar el problemita del IE, saludos.
gracias esta muy bonito y muy funcional.
Muy buen tutorial, largo para mi gusto, pero bastante completo (por lo que se ve porque todavia no lo checo).
gracias y saludos
donde esta el archivo functions.php ?
No puedo descargar elejemplo completo de :
http://www.box.net/shared/u1ofhijbhf
Seria bueno mandar un ejemplo donde se vea mas la utilidad de jquery, por ejemplo que el modificar o nuevo se haga en una misma pagina mediante capas ..
Pero esta ilustrativo tu ejemplo.La intencion tambien cuenta
Saludos desde Lima-Peru 🙂
De donde sale la variable “datos” que pones en los javascript por ejemplo success: function(datos){..
es que no la encuentro disculpa la ignorancia.
Gracias por tu ayuda.
Con function(datos){… estas declarando una variable ó parametro que recibirá la respuesta del proceso en php.
en este ejemplo, lo vemos asi:
– alert(datos) un ventana de informacion con el valor del proceso en php ó
– $(“#midiv”).html(datos) un div que mostrara el valor del proceso en php
saludos
Muy buen articulo. Me fue de gran ayuda
la verdad es que se nota muy interesante pero aun no lo puedo hacer correr, de todos modos gracias por la informacion y si puedes colgar mas datos seria en hora buena.
Por favor Podrias subirlo de nuevo el enlace no funca
no puedo descargar el ejemplo no se si podrias avilitar de la misma forma que los demas datos pa parte de estilo.css y la functions.php. gracias
no puedo descargar el ejemplo no se si podrias avilitar de la misma forma que los demas datos pa parte de estilo.css y la functions.php. gracias
Excelente ejemplo.
No Se Puede descargar el ejemplo, no se si podrias enviarlo a mi correo: teddybp5@hotmail.com, o no se si me puedes proporcionar la nueva direccion de publicacin del ejemplo. Gracias
Si alguien desee tener el ejemplo envieme un correo a or1988@gmail.com …
estare gustoso de ayudarlo. aunque el ejemplo esta claro…
hola, recien queria hacer esto y m e3encontre con este gran ejercio y/o tutorial. solo que le encontre un problema, solo se puede agregar un registro. Y me fije que manda el id=0, me supongo que es por eso que no hay una contador que este sumando o algo por estilo.
Saludos, espero me puedas orientar
porfavor quisiera que corrigas el link para poder descargar el link please te lo agradesco ante mano gracioas
HOla me podrías enviar los archivos, incluyendo style sheet, archivos php, las librerias jquery ..porfa te lo agradeceré bastante.
velarde0686@hotmail.com
para descargar utilicen el firebox … y se lo descargan..gracias amigo por el aporte muy bueno
gracias…
Excelente aporte.
exelente aporte pero el link no funciona… ni con firefox puedes corregirlo
Excelente quede ano nadado con el ejemplo muy buen aporte funciona todo de maravillas :3
excelente tutorial gracias por compartir !
excelente turorial
hola bueno te quiero felicitar ya que es un muy buen tutorial lo unico que falto es hacer funcionar el calendario quiesas fue un error mio, me gustaria que me ayudaras muchas gracias.
Hola, muchas gracias por compartir este trabajo.
Me ha gustado la solución que aplicas al poner el identificador de cliente en el parámetro “id” de cada tag tr. Voy a intentar usarlo en una situación similar.
Saludos
Gracias por el aporte, me parece muy bueno y se puede aplicar en varias situaciones.
Ahora me gustaria saber si puedes ayudarme en un problema ke tengo: Bueno tengo una aplicacion en la ke los clientes suben diferentes archivos al servidor, tanto imagenes como documentos word y pdf, y todo esto se guarda en la bd del servidor, el problema ke tengo es como puedo eliminar los archivos del servidor.
Te agradeceria mucho tu ayuda.
Excelente trabajo!! Bastante completo. Estuve intentando poner el paginador de esta web y me encontré con los mismos problemas que @ryuu, me funciona todo excepto que me da problemas con los links de editar o borrar una vez que cambio de pagina. Veo que @ryuu y @Manuel Hernandez Aravena lo solventaron o lo tienen bien.
Excelente tutorial! Escribes codigo bien limpio. donde se puede bajar el demo o hay que copiar los archivos de la pagina?
Increible, todo está increiblemente limpio y prolijo.
Necesitaba un ejemplo para un proyecto y esto me viene de lujo.
Muchas Gracias.
hola, me encanta tu ejemplo, es muy ilustrativo y me ha ayudado a aprender mucho, pero aplicándolo me ha surgido un problema, y es que cuando modifico un registro (yo no oculto la lista, la mantengo en pantalla, no se si eso influirá) me funciona perfectamente, pero si vuelvo a editar otro, ya no me mete la página de actualizacion.php en la capa formulario, sino que me la carga.
No se si me explico, es como si las funciones solo funcionaran una vez
acabo de descubrir que si sacas el código:
$(“table tr .modi a”).click(function(){…
de consulta y lo metes en un .js no funciona, puede ser?
@javi:
Si ese fragmento de código JavaScript lo colocas a parte no te va a dar pues ese fragmento de consulta.php se llama dinamicamente mediante la funcion en JavaScript ConsultaDatos().
Asi que en resumen cada archivo ó fragmento de código que se va a incluir en otro y va a trabajar con jQuery debe contener su codigo JavaScript incluido y no aparte.
Parece dificil de entender no?
Que buen ejemplo de codigo soy nuevo en este mundo de programar en php, y me pareci fabuloso todo cada una de las opciones funsiona de maravilla.Que buen aporte que nos haces a los que estamos hasta ahora aprendiendo.
Buen artículo, pero CREO que falta algo importante o se me escapa (me extraña que nadie lo haya preguntado):
Lo de functions.php y JQuery.functions.js. El código de las funciones ahí pone que se mete en el archivo JQuery.functions.js, pero por otro lado se requiere el functions.php. No entiendo, eso hay que explicarlo por favor.
Saludos.
functions.php es un script que incluye un calendario simple para seleccionar la fecha de registro. no esta posteado en el articulo, pero esta incluido en el comprimido.
Saludos
Vaya, suponía que se me escapaba algo. No había visto el enlace de descarga de los fuentes.
Enhorabuena por el artículo y por la web.
Un saludo y gracias.
Buenisimo, es desde tiempo que intento solo de aprender a usar jquery y conectarlo a mysql sin resultado.
gracias a ti es muy sencillo de intender y utilizar.
gracias.
Hola amigo me baje el codigo ya tengo creado la base de datos la tabla y todo, al igual cambie los parametros para la conexion a la base de datos pero cuando trata de acceder dice que [:(] Error al conectar a la base de datos, como soluciono esto?
Gracias por el codigo a mi me funciona muy bien inclusive ejecutandolo en mi Ubuntu Server 10.
Ahora, yo necesito agregar mas campos y cambiar los que ya están, es eso posible?
basta con ir agregando los nuevos campos en los diferentes archivos donde estos son utilizados?
(por su puesto, previo a la modificacion del archivo sql)
Gracias por respoder.
Buenas tengo un problema, hice algunos cambios en el codigo para adecuardo a un test que estoy haciendo y me dio el siguiente error
>Notice: Undefined index:
lo que hice fue cambiar nombres de las variables y agregar otras en el archivo, lo extraño es que una variable que quedo con el mismo nombre “telefono” si continuo trabajando,
a continuacion el error completo:
br />
Notice: Undefined index: id_cliente in C:\wamp\www\proyecto\cliente\actualizar.php on line 7
Notice: Undefined index: cedula in C:\wamp\www\proyecto\cliente\actualizar.php on line 8
Notice: Undefined index: nombre in C:\wamp\www\proyecto\cliente\actualizar.php on line 9
Notice: Undefined index: apellido1 in C:\wamp\www\proyecto\cliente\actualizar.php on line 10
Notice: Undefined index: apellido2 in C:\wamp\www\proyecto\cliente\actualizar.php on line 11
Notice: Undefined index: direccion in C:\wamp\www\proyecto\cliente\actualizar.php on line 12
Array
(
[0] =>
[1] =>
[2] =>
[3] =>
[4] =>
[5] => 6
)
Se produjo un error. Intente nuevamente
aqui el codigo:
actualizar(array($cedula,$nombre,$apellido1,$apellido2,$direccion,$telefono),$id_cliente) == true){
echo ‘Datos guardados’;
}else{
echo ‘Se produjo un error. Intente nuevamente’;
}
}else{
if(isset($_GET[‘id’])){
require(‘clases/cliente.class.php’);
$objCliente=new Cliente;
$consulta = $objCliente->mostrar_cliente($_GET[‘id’]);
$cliente = mysql_fetch_array($consulta);
?>
<input type="hidden" name="id_cliente" id="id_cliente" value="” />
Gracias por la ayuda.
Hola que tal esta chido el aporte pero, cambie el nombre de los cuadros de textos y a la ora de enviar los valores no m manda nada,
Hola, todo me funciona bien, pero en editar o ingresar uno nuevo, me sale “Se produjo un error. Intente nuevamente”.. en eliminar, Mostar listado y mostrar registro todo ok
No me considero novato pero tampoco experto… por eso quiero que me ayuden en la forma de que me salga el mensaje de error de forma que acostumbra php, sin que salga ese mensaje personalizado… Esto para ver porque me sale error…
Gracias por la ayuda
Excelente desde hace tiempo pensaba en algo asi y ps ya lo encontre. GRACIAS.
Excelente tutorial, te felicito, he hecho algo parecido pero habian cosas que no me quedaban claras como hacer, asi que me es de gran ayuda el ejemplo
Hey amigo exelente tutorial me sera de mucha utilidad para algunas cosas que quiero hacer…..
Guenas excelente tutorial, oye una pregunta se pude en ese formulario meter un archivo y sis e puede como seria la modificar ojala y me peudas ayudar
Este tutorial está más que excelente. Hacía mucho tiempo que estaba buscando información de como realizar lo que explica aquí. Eres un buen maestro digno de seguir. Tiene muy buena pedagogía para enseñar. Sigue así. Que DIOS te vendiga. Gracias por el aporte.
Esta muy bueno el sistema pero coro haria para que el sistema cargara fotos de los clientes, tomadas con la camara o subidas.
Excelente brother, gracias por este aporte buenisimo si tan solo ubiera encontrado hace 2 meses atras este post.
gracias por el aporte 🙂
Gracias por el gran aporte! …….. quisiera saber a que se refiere la linea: require(‘functions.php’);
, donde está y que contiene ……. saludos.
Hola.
Ante todo gracias por compartir este código.
Tengo cierta experiencia en PHP, pero me encuentro con un problema un poco raro al trastear con tu ejemplo, concretamente en consulta.php.
Sencillamente, si modifico la estructura de la tabla (de BD, no HTML :P) que se consulta la aplicación no devuelve ningún registro, aunque la tabla los contenga.
No he tenido problema en modificar tu ejemplo para poner mis propios formularios, paginar, ordenar, poner lightboxes, validar campos y demás hierbas, y graba correctamente los registros en cualquier tabla (con los INSERT correctos, variables y tal, evidentemente) pero sólo los muestra en consulta.php cuando utilizo una tabla con la estructura original del ejemplo.
Sinceramente no veo el problema, ya que lo único que se hace en consulta.php es instanciar:
require(‘clases/cliente.class.php’);
$objCliente=new Cliente;
$consulta=$objCliente->mostrar_clientes();
Luego en cliente.class.php se devuelve el resultado:
function mostrar_clientes(){
if($this->con->conectar()==true){
return mysql_query(“SELECT * FROM archivos (por ejemplo) ORDER BY id DESC”);
}
}
Y sin más misterios, si se ha hecho la consulta usamos el array $cliente para visualizar:
if($consulta) {
while( $cliente = mysql_fetch_array($consulta) ){
<tr id="fila-“>
…y así con el resto de campos de la tabla, pero
si cambio la estructura de la tabla jamás entra en este último IF. Si llamo a un mysql_query directamente sí que funciona, pero entonces para qué quiero la clase y además no me explico qué le pasa.
¿Podrías explicar qué estoy haciendo mal o si tiene algo raro esto del ajax en ese aspecto?
Gracias 🙂
@Jow:
mmm que raro no? asegurate que la consulta sql sea conforme. Pero como veo en tu comentario todo esta bien. No te sale algun mensaje en pantalla generado por mysql?
Exelente aporte para los que estamos ingresando al mundo de jquery, gracias me ha sido de gran ayuda….
Te amooooo!!!!!, excelente tutorial! , si puedes envíame más ejemplos please.
Pero con esto más que suficiente para disipar mis dudas.
Besitos!
Excelente!
necesito llenar un combo desde mysql de este mismo modo, podrían ayudarme?
ya tengo la función pero no sé cómo llenarlo 🙁 soy nueva usando esta tecnología
alguien puede indicarme cómo lo lleno ?
gracias
Para llenar un combo con mysql lo unico que tienes que hacer es realizar una consulta a la base de datos y recoger los datos con mysql_fetch_assoc estoy te permitirá tener un array asociativo que quedara de la siguiente manera $array[$nombre_campo]
Puedes recorrer el array con un foreach y crear el combo dinamicamente
-En blanco-
foreach ($array as $key=>$value){
echo “” . $value . “”
}
Eso a sido un poco a saco si tienes alguna duda enviame un mail ala suerte! :p
Oye muchas gracias! no tienes idea de como me encamino tu tutotial 😀 Muchas gracias!
muy bueno tu aporte, pero no me corre tu ejemplo ya que al iniciar la fecha de nacimiento no me sale el datapicker, y me envia muchos erros sobre todo en el label con php podrias corregirlos krnalito.
oe brother excelente ..
q barbaro tu aporte
Buen ejemplo, y sobre todo muy bien explicado…enhorabuena!!
si me sirvio comenzar con un mantenimiento sirve bastante
me dio muy buena viuada este tutorial
aprendi de forma practica jquery con esto
bacan!!!!
Excelente tutorial, me ayudó a solventar varias dudas sobre jquery…. felicitaciones
Buenos días.
Excelente artículo y trabajo. estoy comenzando una aplciación y esto me sirvió para arrancar con el pie derecho.
sin embargo hice algunas modificaciones, pero ya no elimina. a qué correo les puedo enviar los hecho para que, por favor, me ayuden a corregir el error?
ola causa quisiera saber como puedo agregarle una paginacion con esas imagenes que tienes en la carpeta img seria bueno que lo publicaras con esas nuevas modificacion. Y esta de lo máximo tu ayuda
muy bueno el aporte, muchas gracias amigo y es cierto no muestra el datapicker pero a mi si me funciono a la perfección. si realiza las funciones..
gracias me silucionaste el problema y ademas resolviste muchas dudas.. gracias.
Hola, estoy empezando con Php y me surgen el siguiente error:
Pasos que he hecho hasta ahora
Instalo Wampserver 2.1
En la carpeta WWW grabo todo el codigo fuente del ejemplo.
Voy a localhost para ver lo que hace y me da el siguiente error
Error al seleccionar la base de datos
Y ya no se seguir.
Alguna ayuda para este aprendiz.
Gracias
@Joaquin :
Ese error sale por que debes especificar el nombre de la base de datos, del servidor, usuario y password.
por lo general el servidor es localhost, el usuario es root y la clave esta vacia. solo verifica el nombre de tu base de datos
Hola JesusVdl, gracias por tu molestia, perdona que insista, en el ejemplo que esta arriba y que descargo con todo echo para ver como funciona, hay una carpeta que se llama sql en donde va el archivo “cliente” y en la carpeta clases el archivo “conexion.clas lleva lo siguiente:
BaseDatos = “empresa”;
$this->Servidor = “localhost”;
$this->Usuario = “root”;
$this->Clave = “”;
}
function conectar() {
if(!($con=@mysql_connect($this->Servidor,$this->Usuario,$this->Clave))){
echo”
[:(] Error al conectar a la base de datos
“;
exit();
}
if (!@mysql_select_db($this->BaseDatos,$con)){
echo “
[:(] Error al seleccionar la base de datos
“;
exit();
}
$this->conect=$con;
return true;
}
}
?>
El nombre de base de datos sale como “empresa” si lo cambio por “sql” o por “cliente” sigue dando error , lo que no entiendo es como se le dice en PHP el enlace para ir a esa carpeta, quiza este obsesionado de la manera que funcionan los enlades en html y aqui son de otra manera y por eso no consigo que me funcione.
Un saludo
hola jesusvld saludos, excelente trabajo, muchaaas gracias, eres grande y dices que no sabes usar JQuery, me sirvio mucho tu ejemplo, de nuevo muchas graciaaas
TIOOO, te he dicho que te quierooO!! gracias por el trabajo!
muy buen aporte, funciona al 100% gracias.
muy buen aporte.
lo esruve analizando y modifique para crear una web con menu y varios mantenedores, y ahi me encuentro con un problema.
lo que me gustaria es saber donde declaras el objeto formulario y tabla a los cuales haces la actualizacion asincrona ???
Muy buen aporte,gracias
Muchas gracias por la aportación. Muy didáctico para un principiante de AJAX como yo.
Me encontré con un problema:
Mientras que en Firefox y Google Crome funcionaba 100% en I Explorer 8 no actualizaba las modificaciones que hacía tras editar los registros.
Para resolver el problema modifiqué el javascript del archivo consulta.php, en la parte “mostrar formulario de actualizar datos”, poniendo type: “POST” en lugar de type: “GET”.
ORIGINAL:
// mostrar formulario de actualizar datos
$(“table tr .modi a”).click(function(){
$(‘#tabla’).hide();
$(“#formulario”).show();
$.ajax({
url: this.href,
type: “GET”,
MODIFICADO:
// mostrar formulario de actualizar datos
$(“table tr .modi a”).click(function(){
$(‘#tabla’).hide();
$(“#formulario”).show();
$.ajax({
url: this.href,
type: “POST”,
Espero que os sirva mi pequeña contribución.
Hombre Esta Excelente!!!
Gracias..
Te felicito, Gente como tu ayudas a muchos, Gracias
Muy buen tutorial
Solo tengo una duda ya que apenas inicio, como le puedo ponerpara que me ponga paginacion a mi tabla de este ejemplo
Gracias por la aportacion
saludos
excelente ejemplo…funciona a la perfección.
hola, no consigo conectar con la Base de datos, introduzco qil930 ,localhost, qil930 y la contraseña pero no se conecta.
en cambio con otro menu de usuario si que se me conecta con el siguiente codigo:
problema solucionado! simplemente era que al haber hecho la conexion mal la primera vez… con el include_once()… no me actualizaba los valores de la base de datos…
muchas gracias!
Comprobado…. JQuery write less do more.
Gracias por el aporte.
amigos urgente, tengo problemas en la conexion, esta todo bien al parecer, pero me tira el error
[:(] Error al conectar a la base de datos
no he encontrado que pueda ser, favor amigos ayudenme lo antes posible
amigos porfa, segui paso a paso las instrucciones y no puedo conectarme, me dice
error al conectarse a la base de datos
alguien me dice por
que pf
Saludos estimados amigos muchas gracias por el aporte funciona correctamente, muchas gracias nuevamente….
excelente funciona a la perfeccion
muy buenas tardes tengo una gran duda, en el tercer pantallazo aparece la variable $campos, la cual no ha sido declarada por ningun lado,aparece de repente, ¿alguien podriadecirme porfavor por que aparece ahi?
hay otra cosa q no me ha dejado seguir, en el pantallazo no 3 la funcion de la clase cliente (insertar), lleva una consulta incompleta,falto la parte de especificar los valores, eso es lo q yo quiero saber.
Excelente aportacion…me gustaria..aumentar la paginacion..y validaciones de campos en javascript..
Saludos
no veo el archivo functions.php–que es llamado por actuaizar.php
Muy bueno y funciona correctamente, además es muy simple de comprender.
Con este ejemplo dan ganas de programar las páginas web sólo con el JQuery.
Muy bueno el aporte, otra vez y muchas gracias.
Muchas gracias por tu aporte . Un excelente Ejemplo.
Felicitaciones
Felicidades por el aporte es un sistema muy interezando, pero seria mas genial si contara con un buscador y paginar,ps es necesario cuando llegamos a tener muchos datos en la base de datos.. felicidades eh
oye esta muy bueno el tuto pero tengo una preguntaporque de manera local con mamp funciona y alojado en un servidor web no despliega los datos solo puedo agregar te adjunto la url http://www.softballtest.site50.net
espero puedas ayudar gracias
hola muy bueno su tutorial gracias por ayudarnos
un favor no tendra otro sistema casi igual muchas gracias espero su respuesta
Muy bien, era lo que necesitaba solo que a modificar un poco me pasa algo raro: a rellenar el formulario tengo que hacerlo rapidito que si tardo un poco mas no me graba los datos en la base de datos lo mismo me pasa con actualizar …Que puede ser ???
Muy bueno el tutorial, jQuery junto a PHP la verdad es que es muy potente y evitando lo engorroso que es manejar AJAX con JavaScript.
Muchas Gracias por el Tutorial!!
Excelente ayuda!
Lo que andaba buscando para poder empezar a desarrollar mi aplicación web de mantenimiento de azulejos.
Continua así. Un saludo.
Excelente!
Me ayudo a comprender y dejar claros ciertos conceptos.
Dios los bendiga.
muchas gracias… excelente ejemplo.
Quisiera saber si utilizaste JQuery solo o hay una version especial para usarla en php.
Tu tutorial esta bueno. Gran aporte
hola buen material , quisiera saber como validar los datos , por ejemplo telefono que no deje ingresar letras se puede usar el jquery validate?,gracias
Muchas gracias, me ayudo muchísimo para entender esta nueva tecnología.
blog de este estilo incentivan el crecimiento del conocimiento, felicitaciones.
slds desde colombia.
Excelente todas mis dudas despejadas en este tutorial!!!
Excelente codigo, funcional y facil de utilizar. Ahora solo resta hacer las modificaciones respectivas para nuestras aplicaciones.
Gracias y Saludos
hola: dime es necesario tener archivos : nuevo.php
actualiza.php eliminar.php ……… ¿cuando se produce el evento…. ?
se podria manejar todo en un mismo archivo … osea en index.php y digamos ahi mismo salga un popup para hacer lo que deseamos… de tal forma mi ultima pregunta seria … si .. da lo mismo .. tener popup en el mismo index.php versus hacerlo archivo por archivo .. claro con el jquery
cual es mas rapido? bueno espero me aclares estas dudas … saludos y muchas gracias…
necesito que me ayudes a implementarle paginación a esta aplicación pues he tratado pero no me funciona, enviame alguna solución a rhernandez@geosi.geocuba.cu .Te lo voy a agradecer infinitamente!!!
buen dia!!!
estuve checando el codigo, es justo lo que necesito para la escuela, pero al momento de intentar adapatarlo a mi base de datos, quitando la fecha de nacimiento y agregando un user_name y un password, estos ultimos datos ya no me los reconoce el arreglo con el que manejas el insert ni el update, simplemente los manda vacios, quisiera saber porque pasa esto y sobre todo, como arreglarlo
Buenas a todos…
soy novato en esto pero tengo algunas nociones de php y mysql,el ejemplo que acabo de descargar lo quiero ejecutar con el wampserver pero me sale este error: ” [:(] Error al seleccionar la base de datos ” ahora cuando estoy creando la base de datos en el phpmyadmin no se que nombre ponerle???.Gracias a todos
Holaaa!!! Antes que nada muchísimas gracias por el aporte ya que me funciono bastante para basarme en algo parecido que estaba desarrollando, ademas esta muy bien hecho… Gracias!!! =D
como podria ser si yo al ingresar un registro quisiera ingresar una imagen tambien?
si alguien me orienta se lo agradeceia porque lo necesito mucho.
Buenas estoy intentando recolocar los php en otras carpetas para tenerlo organizado pero la llamada a los php con ajax no muestra el contenido en la tabla, pasandole esta ruta relativa:
rsccliente/consultaCli.php
$(document).ready(function(){
$(‘#ulnavigator > li’).click(function(){
//$(‘#formulario’).html(”);
$(“#formulario”).hide();
$(‘#tabla’).show();
var urlx = $(this).attr(‘xref’);
//debugger;
//$.get(urlx, function(data) {
// $(‘#formulario’).html(data);
// alert(‘Load was performed.’ + data);
//});
UpdateTabla(urlx);
return false;
});
});
Esto esta en jquery.funtions.js
function UpdateTabla(Url){
$.ajax({
url: Url,
cache: false,
type: ‘POST’,
success: function(data){
$(“#tabla”).html(data);
}
});
}
El monitor de WebExplorer me muestra la carga del php
http://localhost/rsccliente/consultaCli.php php pero no sale en la tabla. Pasa algo por poner los php en carpètas aparte.
Hola muy buen dia…
Soy nuevo en esto y estoy tratando de utilizar este codigo en un pequeño proyecto, pero tengo algunos problemas..
He comprendido la mayoria del codigo y ya logre hacer algunas de las funciones basicas con los registros en la BD..
El problema que tengo en este momento es ala hora de llamar a las funciones dentro de jquery.functions.js..
Por ejemplo:
Al hacer click en el Boton “cancelar” no sucede nada.. Dejo el codigo final de este…
”
” ), Es decir, ninguno de los eventos “onclick” y “onsubmint” se ejecutan…
Espero puedan ayudarme con esto…
muchas gracias..
saludos..
Felicitaciones por el blog…
Blogs como estos, son los que realmente animan a seguir aprendiendo…
Muchísimas gracias! Es facil de instalar para ver el código y FUNCIONA! Solo hay que editar el conexion.class.php con nombre de usuario y clave y crear la tabla en MySql
Ademas me permite ver como se implementan los objetos en PHP! Muy Bueno Gracias y felicitaciones!
hOLA SALUDOS, UN GRAN POST MUY BUENO PERO USANDO TU CODIGO ME LANZO EL SERVIDOR WAMP ESTE ERROR: Warning: include() [function.include]: Failed opening ‘consulta.php’ for inclusion (include_path=’.;C:\php5\pear’) in C:\wamp\www\JQUERY_PRUEBA\index.php on line 16
PODRIAS AYUDARME USO WINDOWS SEVEN SI TE SIRVE DE ALGO Y GOOGLE CHROME
muy bueno el post, lo unico que le faltaria es un buscador y un paginador y quedaria exelente. tenes alguna idea como agregarlos que me esta haciendo falta. gracias
corre de maravilla pero es mucho para un novato es para user avansado …en php
. no tendras un codigitos para los novatos y comprendible de ante mano muchas gracias …
Hola:
Ante todo, te felicito por un ejemplo tan claro.
Mi pregunta es:
¿Como evitar que convierta todos los textos a mayúsculas?
hola un ejemblo muy bien explicado solol tengo una pequeña duda si kiero meter un combobox pero que hace referemcia a otra tabla? es que lo ando haciendo pero me marca error, nesecito meter a fuerzas las consultas en la clase cliente supongo? no espero respuesta xD
edit ya pude con el problema muchisismas gracias (= se te agradece, espero que si me surga otra duda puedas constestar aun que tu codigo esta muy bien explicado por si solo.
@jesusvid:
Al introducir texto en el formulario, necesitaría saber como evitar la conversión automática a mayúsculas. ¿Como hacer para que, si quiero escribir en el nombre “Antonio Fernández”, lo deje tal cual?.
Actualmente lo convierte automáticamente a “ANTONIO FERNÁNDEZ”, aunque en la tabla “cliente” si lo deja como “Antonio Fernández”.
Bueno… me contesto a mí mismo:
Para mostrar el texto tal cual se introduce en cada columna, hay que eliminar la siguiente linea 7 de la hoja de estilos webapp/css/estilo.css, que contiene:
text-transform:uppercase;
Un saludo.
Buen dia, me encanta esta mini-aplicacion una duda. Como hago para que solo aparezca el boton Nuevo. y cuando se registren aparezca en la parte de abajo tus datos fueron: esto esto y esto
y en otra pagina aparte la consulta(listo).
lo que necesito es que solo muestre la informacion que agregaste al registrarte. alguien?
HOla:
Muchas gracias por el aporte. Quería consultar una duda que tengo: En los formularios se define el campo action, que indica la URL .php a la que se envían los datos del formulario, pero a la vez se ejecuta una función javascript que vuelve a enviar los datos a la misma URL. ¿No es hacer la misma acción dos veces?
Muchas gracias de nuevo.
Hola @Peripecio:
La idea es que sino esta habilitado javascript funciona de todas formas. Probadlo 🙂
Muchas gracias por la explicación, es realmente buena y clara. Sólo un pequeño detalle ortográfico. Al principio del texto escribes “ha mi parecer” ese ha es la tercera persona del singular del presente de indicativo del verbo haber, cuando pretendes escribir “a mi parecer” done a es una preposición.
Hola muchas gracias por el tuto esta genial, solo que tengo un error mira
Fatal error: Class ‘Cliente’ not found in C:\ACE\DesarrolloWeb\consulta.php on line 3
me podrias ayudar gracias
ola que tal.. un apreguntota
como le hago en la funcion grabar y actualizar para guardar select..
bueno mas como ira en “jQuery.functions.js”
veo que para opciones lo declaras asi
“var alternativas = $(“input[@name=’alternativas’]:checked”).attr(“value”);”
como declaro un select?? saludos
Hola me gustaría saber cual es el código que tengo que aplicar con, php para que las partes que sean null en la base de datos no aparezcan.
gracias por vuestro tiempo. un saludo
No habria un conflicto al ejecutar las acciones de javascript y la llamada a php directa a la vez?
cual tiene la prioridad?
el ajax pisa a la llamada al php directo?
@Daniel:
En realidad no hay conflicto alguno, las acciones javascript son un puente entre las acciones del usuarios y los procesos en php, no entran en conflicto alguno. El uso de estos lenguajes cumplen propositos diferentes en la aplicación de ejemplo.
Hola, oye tengo una duda, esque cuando ejecuto la aplicación me manda este error:
Warning: mysql_fetch_array(): supplied argument is not a valid MySQL result resource in C:xampphtdocswebappactualizar.php on line 29
ojala puedas ayudarme 🙂
Disculpa en donde esta el functions.php ese error me marca en nuevo.php
require(functions.php)
En archivo functions.php está dentro del comprimido, hay que descargarlo.
Muchas gracias por el codigo, me fue de mucha ayuda.
Saludos!
Excelente yo creo que mi profesor de PHP saco información de aqui, bien explicado y buen codigo, una duda :p.
En el caso que la base de datos sea de otro manejador obvio que quizá la base de datos tenga el mismo nombre peró, ¿Funcionara con otras bases de datos? estas clases como la de cliente o sera necesario implementar PDO para alzanzar esto que te digo?
De antemano gracias por leer mi chorote y me harias un programador feliz si me respondieras.
🙂
Estimado, excelente el código, mis felicitaciones, solo una consulta, he intentado implementar un input para poder buscar un registro especifico o los que contengan alguna letra de lo buscado y no lo he podido lograr, tu me podrías ayudar con eso.
Saludos
Está muy bueno el código . Muchas Gracias, yo lo estoy modificando para poder usarlo como mantenimiento con cabecera y detalle, … en la cabecera no hay problema pero al hacer el detalle ya no me sale con el formato por que podrá ser?
ayuda urg????estoy intentado de subir también el imagen de usuario pero no funciona
exelente tutorial, muy bien explicado y sobre todo gracias por compartir tus concimientos exelente
Estupendo tutorial, pero con tantos clientes me hace falta un buscador. ¿Alguien sabe como poner un buscador y que me muestre por ejemplos los de cierta ciudad?
Si alguien tiene algún ejemplo o enlace, me lo puede enviar a marchoso.benito@gmail.com
Gracias.
functions.php? donde esta ese error me arroja
Excelente . muy bueno
Buenas, ¿cómo se modificaría el código para cambiar a mysqli?
Excelente. Me salio y me funciona pero tengo una duda se puede hacer que el eliminar mueva a otra tabla la informacion y que se borre de donde esta.
Excelente manual, me gustaría saber si el código esta totalmente depurado, libre de errores, porque pienso usarlo y no me gustaría que después de intentar ponerlo en práctica me aparezca algún tipo de error.
Alguien que me pueda compartir conmigo el codigo
Pues a mi me mostraba errores que decian:
Error en la linea 3 de calendario.php indefinida variable index month & year.
y me desespere y elimine el proyecto. :/
hola, una pregunta, como puedo agregar llaves foraneas, en codigo,
disculpa son nueva en orientado a objetos
Se ve prometedor el tutorial pero no entiendo cómo pudieron usar una manera tan horriblemente desordenada para mostrar el código.