jQuery AJAX para Realizar Consultas con PHP y MySQL

/, jQuery, MySQL, PHP/jQuery AJAX para Realizar Consultas con PHP y MySQL

jQuery ajax para Realizar consultas con php y mysql

Cuando inicie la estapa de aprendizaje como desarrollador web, en un curso aprendí javascript por encimita y en una ocasión hicimos un ejemplo de operaciones aritméticas donde para mi sorpresa no funcionaba bien, ja ja ja, lo odié por un tiempo y hoy en día de la mano de jquery desarrollo mis aplicaciones, simplemente es lo mejor.

Jquery ajax $.ajax() sin duda alguna es una de las funciones que mas uso en el desarrollo de aplicaciones Web, no dudo que gran parte de mis colegas también hechen mano de esta. Para aplicaciones web es muy útil y nos ahorra mucho tiempo además de permitirnos hacer cosas muy interesantes y atractivas para el usuario final.

¿ Definición de AJAX ?

AJAX, acrónimo de Asynchronous JavaScript And XML (JavaScript asíncrono y XML), en si no es un lenguaje de programación sino una técnica que engloba 4 tecnologías existentes:

  1. XHTML, HTML y CSS
  2. Document Objet Model (DOM)
  3. El objeto XMLHttpRequest
  4. XML, HTML, JSON.

La definición detallada de AJAX la pueden encontrar en wikipedia.

En esta serie jQuery AJAX con PHP y MySQL aprenderemos a realizar consultas a una base de datos MySQL utilizando javascript y PHP. Dividiré esta entrada en varios ejemplos de manera que quede entendible el proceso para crear aplicaciones que realicen llamadas asincronas a nuestro servidor web, inclusive ya he utilizado jQuery AJAX en post anteriores.

La función jQuery AJAX $.ajax()

En el sitio oficial de jquery definen la función jquery ajax $.ajax() de la siguiente manera:

La biblioteca jQuery tiene un conjunto completo de capacidades de AJAX. Las funciones y los métodos de la misma nos permite cargar datos desde el servidor sin necesidad de una actualización de la página del navegador.

Una de las principales ventajas de usar jquery ajax es que no tenemos que armar el objeto XMLHttpRequest a manita, jquery ajax se encarga por nosotros, de tal manera que por medio de sencillas funciones podemos lograr todo el proceso de la llamada asincrona.

Es importante destacar que no siempre debemos usar jquery ajax en nuestros desarrollos y/o sitios web estáticos, en lo personal creo que aplica más para el desarrollo de sistemas web que realizan interacción con bases de datos, XML, JSON, documentos de texto plano, etc.

Ejemplo para la implementación de jQuery AJAX $.ajax()

En este tutorial crearemos una lista de usuarios de forma que podamos insertar y editar registros en una base de datos, todo dentro de la misma página sin necesidad de estar recargando por cada registro insertado o editado. Además cada que realicemos una inserción o edición vamos a actualizar el listado de registros.

Para tener un ejemplo lo mas completo posible implementaremos la validación de campos por medio de el plugin jquery validate e inclusive validaremos los campos del lado del servidor.

También usaremos bootstrap y jquery ui para dar estilo y presentación a nuestro ejemplo.

Dividiremos el tutorial en 12 videos que a continuación enumero:

  • Video 1 Descarga y recopilación de herramientas y frameworks necesarios como bootstrap, jquery ui y jquery
  • Video 2 Creación de árbol de directorios
  • Video 3 Diseño de mockup
  • Video 4 Creación de base de datos y tabla mysql
  • Video 5 Maquetación de la interfaz de usuario
  • Video 6 Aplicación de estilos con bootstrap y jquery ui
  • Video 7 Validación de formulario con jquery validator
  • Video 8 Creación de consulta y presentación de listado de registros.
  • Video 9 Configuración jQuery $.ajax()
  • Video 10 Creación de interacción para insertar nuevos registros a la base de datos
  • Video 11 Creación de interacción para edición de registros y actualización de lista de usuarios
  • Video 12 Eliminando registros de la tabla usuarios (Nuevo)

Al final de este tutorial podrás implementar todo un sistema de acceso e interacción con tus bases de datos por medio de jquery ajax, php y mysql.

By | 2018-03-25T22:33:41+00:00 septiembre 17th, 2012|Categories: Desarrollo Web, jQuery, MySQL, PHP|Tags: , , |203 Comments
Desarrollador web front y back end, php, mysql, css3, html5, twitter bootstrap, jquery . . . twitero, bloguero, consultor de IT y padre de dos hermosos bodoques. Visita mi Perfil en Google +

203 Comments

  1. Jonathan García 17 septiembre, 2012 at 9:40 AM

    A descargar

    • Luis Fernando Cázares 17 septiembre, 2012 at 9:42 AM

      Gracias, espero sea de utilidad y sobre todo recibir comentarios y sugerencias

      Saludos

      • oscar 19 octubre, 2012 at 4:17 PM

        Muy buenos tus tutoriales, donde puedo descargar los codigo fuente? gracias por todo

    • Ricardo 16 marzo, 2015 at 8:25 PM

      El mismo ejercicio, pero con HTML

      • Luis Fernando Cázares Bulbarela 18 marzo, 2015 at 11:04 PM

        Hola Ricardo buenas noches, no comprendo bien tu comentario, agradecería me puedas dar mas detalle.

        Saludos

  2. Chico3001 27 septiembre, 2012 at 1:08 PM

    No seria mejor invocar JQuery desde un servidor conocido como Jquery o Google en vez de descargarlo como libreria?

    • Luis Fernando Cázares 27 septiembre, 2012 at 1:15 PM

      Hola buenas tardes muchas gracias por tus comentarios, claro que sí, es una muy buena práctica y bastante recomendada.

      Saludos

  3. Net 27 septiembre, 2012 at 4:49 PM

    Hola que tal super util e interesante todo esto para no andar actualizando la pagina y todo en uno solo… no tienes un ejemplo donde se realize algo así… por ejemplo un modulo de ventas donde yo escriba un codigo de barras y esa informacion de llene a una tabla, vuelva a agregar otro y se actualize la tabla junto con la informacion anterior, y asi me de una suma total de precios de la X cantidad de articulos agregados..

    sin mas por el momento felicidades por tu proyecto!

    • Luis Fernando Cázares 27 septiembre, 2012 at 5:27 PM

      Hola buenas tardes, muchas gracias por tus comentarios tan alentadores, me da gusto saber que las publicaciones estan siendo de utilidad para la comunidad.
      En cuanto a lo que me preguntas, se puede desarrollar sin problema, inclusive esta serie te puede ayudar para que te des una idea de lo que debes hacer.

      Saludos

  4. Chico3001 27 septiembre, 2012 at 6:31 PM

    Tip: en vez de crear una funcion que vaya construyendo las tablas creo que es mejor y mas rapido usar el motor Smarty, construir una plantilla para la tabla con los datos de la base de datos y despues pasarla a la aplicacion ya sea usando la funcion display o cargarla en variable usando fetch

    http://www.smarty.net/docs/en/language.function.html.table.tpl
    http://www.smarty.net/docs/en/api.display.tpl
    http://www.smarty.net/docs/en/api.fetch.tpl

    Se puede identeificar si el llamado es normal o AJAX usando la siguiente funcion:


    if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
    echo 'ajax';
    }
    else {
    echo 'no es ajax';
    }

    • Luis Fernando Cázares 27 septiembre, 2012 at 6:47 PM

      Hola buenas tardes, muchas gracias por tus sugerencias, le dpy un vistazo a tu recomendación.

      Saludos

  5. Lepoy 2 octubre, 2012 at 4:35 PM

    Muy Buenos, tus tutoriales , muchas cosas interesantes para aprender, Ansioso por los que faltan, Gracias

  6. Ramón Ocampo 27 octubre, 2012 at 1:27 AM

    Me ha gustado mucho su trabajo, me gustaría saber ¿cómo manejar roles de usuarios?, y login de usuarios claro está si no es mucha molestia, soy novato pero me gusta mucho la programación y me ha gustado PHP

    • Luis Fernando Cázares Bulbarela 27 octubre, 2012 at 1:52 AM

      Hola Ramón, buenas noches, muchas gracias por visitar mi blog, en cuanto a lo que solicitas, estoy preparando un screencast de login con jquery, AJAX, php y MySQL en una ventana modal, en breve lo publico.

      Buen fin de semana

  7. Juan Carlos Gámez 3 noviembre, 2012 at 4:45 AM

    Buenos dias, muy bueno pero no puedo descargar los codigo fuente.
    Gracias un saludo

  8. Pablo Eduardo 5 noviembre, 2012 at 10:18 AM

    Buenas tardes, eh tratado de descargar el código pero no lo eh logrado, no se si lo pudiera compartir 🙂 Gracias

  9. Pablo Eduardo 5 noviembre, 2012 at 10:43 AM

    Gracias ya se pudo, de hecho ya le envié un mensaje en el twitter 🙂

  10. […] el video tutorial  jQuery AJAX para Realizar Consultas con PHP y MySQL aprendimos a realizar llamadas asíncronas a nuestro servidor web a través de una ventana de […]

  11. Henry 21 noviembre, 2012 at 9:00 PM

    Hola Luis Fernando, Muy bueno el tutorial, es tan bueno que estoy implementándolo en mi proyecto, en estos momentos me he encontrado con el siguiente error java script “ERROR GENERAL DEL SISTEMA, INTENTE MAS TARDE “, quisiera saber como encontrar donde esta la falla exactamente, ¿como lo puedo averiguar? Muchas gracias por tu colaboración.

    • Luis Fernando Cázares Bulbarela 21 noviembre, 2012 at 10:52 PM

      Hola Hery buenas noches, muchas gracias por tus amables comentarios, comunmente cuando avienta ese error es porque hay un error en la programación PHP, para verlo lo que hago es comentar en mi javascript la línea dataType: “json” e incluyo un alert(response) dentro de success: function(response){}.

      Es importante que tu server tenga activado mostrar errores de PHP, si no al inicio del script PHP incluye la linea ini_set(“display_errors”,true);

      Te sugiero descargar de mi Repositorio GitHub el código completo para que lo revises con calma y veas las diferencias.

      Saludos

  12. Luis 27 diciembre, 2012 at 5:40 PM

    De antemano felicitaciones por el excelente tutorial lo logre implementar tal cual como te sale a ti, sabes algo que se pudiera añadir es la eliminacion de usuarios
    ahi en la misma ventana al costado de editar, no hay mas que aplaudir un gran trabajo espero sigas sacando mas tutoriales con jquery y bootstrap un saludo de peru.

    • Luis Fernando Cázares Bulbarela 27 diciembre, 2012 at 8:10 PM

      Hola Luis buenas noches, muchas gracias por tus amables comentarios, creo que si sería una buena idea agregar esa parte, voy a organizarme para publicarlo en breve

      Saludos y feliz cierre de año

  13. Ricardo 21 enero, 2013 at 1:00 AM

    Bastante didactica tu serie de jquery-ajax-php-mysql, con tips aplicables a cualquier proyecto de desarrollo, pero algo me faltó y es un problema no menor utilizando entre otros ajax, nada sobre concurrencia en bases de datos. Resulta un problema para software de gestión empresarial de cualquier tipo o arquitectura y armar dinamicamente las tablas html como tu lo haces sin gatillar un evento de actualizacion, tarde o temprano te dará fallos en la integridad de datos. Puede que exceda el ámbito del tutorial pero creo que vale la mención.

    Me pasaré más seguido por tu blog, tiene cosas muy interesantes.

    Saludos.

    • Luis Fernando Cázares Bulbarela 21 enero, 2013 at 5:47 PM

      Hola Ricardo buenas tardes, muchas gracias por tu amable comentario, con respecto a este, si tienes algo sería bueno lo compartas con la comunidad, inclusive si gustas puedo invitarte a escribir en mi blog sobre este tema.
      Recibe un cordial saludo

  14. julian david osorio 28 enero, 2013 at 12:09 PM

    Hola he seguido tus tutoriales y paso por paso me he descado lso archivos he comparado con mi implementacion y me sigue saliendo el error , “ERROR DE SISTEMA INTENTE MAS TARDE” no encuentro la solucion. te dejo los codigo fuente a ver si tu ves algo :S


    $(function(){
    // Validar Formulario
    $('#AddTicketOnlineForm').validate({
    submitHandler: function(){
    var str = $('#AddTicketOnlineForm').serialize();

    alert(str);

    $.ajax({
    beforeSend: function(){
    $('#AddTicketOnlineForm .ajaxLoader').show();
    },
    cache: false,
    type: "POST",
    dataType: "json",
    url:"AddTickets-SEND.php",
    data:str + "&accion=addTickets&id=" + Math.random(),
    success: function(response){

    // Validar mensaje de error
    if (response.respuesta == false) {
    alert(response.mensaje);
    }
    else {
    // si es exitosa la operacion
    alert(response.contenido);
    }
    $('#AddTicketOnlineForm .ajaxLoader').hide();
    },
    error:function(){
    $('#AddTicketOnlineForm .ajaxLoader').hide();
    alert('ERROR GENERAL DEL SISTEMA');
    }
    });
    return false;
    },
    errorPlacement: function(error, element) {
    error.appendTo(element.prev("span").append());
    }
    });
    });

    • Luis Fernando Cázares Bulbarela 28 enero, 2013 at 2:50 PM

      Hola Julian muchas gracias por seguir mis tutoriales, el error que te sale es porque tu php no esta regesando un json sino texto plano, comenta esta línea: dataType: “json” y agrega en el success esto alert(response), actualizas la páfina y vuelves a correr tu acción, debes percatarte que tu php este activado par mostrar mensajes de error.

      Saludos

    • GaSK 14 octubre, 2013 at 6:52 PM

      Con respecto al “misterioso” mensaje de “ERROR GENERAL DEL SISTEMA, INTENTELO MAS TARDE”, pues trasteando un poco, y fijandome en los mensajes de error previos, vi que esto de daba al intentar obtener una columna de la tabla usuario, para ser mas especifico, idUsuario, en mi base de datos estaba como idusuario, y no concordaban, porque no coinciden los nombres de olumnas por la mayucula “U”, simplenete, cambiando a idusuario en el script, todo fue bien.

      Gracias por este util ejemplo!!!!!!!

  15. Gufo 2 febrero, 2013 at 9:29 AM

    Hola,
    me gustaría saber cómo hacer un sistemas de comentarios como éste. Que puedan poner imágenes los usuarios, etc…

    Gracias

    • Luis Fernando Cázares Bulbarela 4 febrero, 2013 at 2:09 AM

      Hola buenas ncohes, muchas gracias por visitar mi blog, en cuanto a lo que preguntas, tendrías que utilizar varios de los scripts que aquí he publicado e integrarlos para tu aplicación.

      Saludos

  16. Erick 4 febrero, 2013 at 8:31 PM

    Hola buenas noches esta muy interesante tu web, es un sitio muy ùtil para aprender y creeme que he querido aprender a utilizar ajax, jquery, jquery-ui.
    He notado un problema con tus videos, no se logran apreciar, seria recomendable usar una resoluciòn que permita se logre entender el contenido del video, sobre todo el código fuente.

    • Luis Fernando Cázares Bulbarela 5 febrero, 2013 at 1:01 PM

      Hola Erick buenas tardes, muchas gracias por tus amables comentarios, no me lo vas a creer pero como he sufrido con esa parte de la calidad de los videos, pero bueno si te sirve de algo en mi Repositorio GitHub CazaresLuis puedes descargar todo el código.

      Saludos

  17. Gufo 5 febrero, 2013 at 8:04 AM

    Si, eso ya lo hice, pero me surgen varios problemas. La conexión me la hace bien, pero no me guarda en la base de datos . Cuando publico, aparece, pero al refrescar lógicamente desaparece al no estar en la base de datos y la inserción la tengo bien hecha, o eso creo.

  18. Ugo 10 febrero, 2013 at 3:31 PM

    Que Dios te Bendiga! Que buena info.

  19. Andres 13 febrero, 2013 at 8:31 AM

    Buenos dias Luis Fernando, excelente tutorial, quisiera aprender mas ya que soy un poco nuevo en el tema de la programacion, en este caso me gustaria que me ayudes a incorporar el boton borrar y poner la funcion para que realice ese cometido en este proyecto, muchas gracias.

    • Luis Fernando Cázares Bulbarela 13 febrero, 2013 at 2:38 PM

      Hola Andrés buenas tardes, muchas gracias por tu amables comentarios, estoy trabajando en esos tutoriales la verdad es que no se si los saque este mes, pero me voy a apurar para tenerlos listos.

      te sugiero que así como hacemos el de edición trates de hacer el de eliminado, por lo general no es recomendable eliminar el registro sino poner una marca en un campo, creo que traemos el de status, lo que se hace es cambiarlo a 1 y/o 2 dependiendo de como lo quieras manejar.

      Saludos

  20. Victor 13 febrero, 2013 at 11:52 AM

    muy buen tuto, tenia algunas dudas con respecto al ajax, pero ya estan solucionadas…o eso creo…un saludo, suerte y muchaos tutoriales mas

    • Luis Fernando Cázares Bulbarela 13 febrero, 2013 at 2:41 PM

      Hola buenas tardes Víctor, muchas gracias por tus amables comentarios, pronto tendremos nuevo tutorial

      Saludos

  21. Monica 20 febrero, 2013 at 5:24 PM

    Hola Luis que tal, el día de ayer me encontré con esta pagina y hoy comencé a ver tus videos, hasta ahorita voy en el video numero 8, pero ya no puedo esperar más, tengo que comenzar a programar tu ejemplo, esta genial!!!, sobre todo porque en mi vida he usado Ajax.
    En estos momentos me encuentro desarrollando un sistema para un gimnasio y pensaba hacerlo únicamente en PHP y SQL, pero no, tengo que implementar tu ejemplo.
    Muchas gracias y en norabuena, mas videos de estos por favor :D, un saludo.

  22. Monica 20 febrero, 2013 at 5:41 PM

    Hola Luis, claro que lo haré, es más… pienso ver todos tus tutos, me encantaron. Muchas felicidades, y por cierto, yo soy de Orizaba!!! jeje un abrazo

  23. Fred 24 febrero, 2013 at 1:18 PM

    hola luis buenas tardes estoy viendo tus videoturiales estoy aprendiendo ya que me interesa las validaciones en la ventana modal ya que tengo una tabla con mucho esfuerzo realizo que al insertar datos regresa ala tabla muchas gracias por compartir tu codigo excelente maestro … 😉 ahora solo una duda en la ventana modal como cancelo y que regrese ala tabla creo es una pregunta facil y como puedo contactarte para algunaz dudas gracias de antemano saludos desde chiapas…

    • Luis Fernando Cázares Bulbarela 24 febrero, 2013 at 5:49 PM

      Hola buenas tardes Fred, muchas gracias por tus amables comentarios, la verdad es que no entiendo muy bien tu pregunta, no se si pudieras ser mas específico, en cuanto a localizarme puede ser vía twitter @CazaresLuis o por gmail luis.f.cazares

      Saludos

      • Fred 24 febrero, 2013 at 7:38 PM

        Gracias otra vez de antemano luis fernando disculpa por la mala explicacion de mi problema si lo que pasa esque estoy realizando una tabla con paginacion y busqueda con su respectivo crear editar y eliminar con ajax que regrese ala misma pagina de la tabla y ademas que al presionar un link muestra una ventana modal con sus campos lo que no e podido es validar esos campos dentro de la ventana modal e probado con distintos plugins de jquery creo es mi ventana modal que estaba mal, presisamente en este momento estoy tratando de adecuar la forma que tienes ami proyecto lo que quisiera es la opcion cancelar en la ventana modal tengo mas o menos la idea pero no le encuentro muchas gracias por atender mi pregunta y por la ensenañza maestro 😉 por cierto e visto tus otros tutoriales de ventanas modales con plugin validate

  24. Juan Nájera Mendoza 25 febrero, 2013 at 5:37 PM

    Disculpen, como puedo limpiar los datos del forrmulario si estoy usando bootstrap ? me refiero a cuando abro el form y al cerrarlo no lo limpia quiero que limpie el dato cuando vuelva agregar, o que libreria es la que hace esto? gracias por su atención

    • Luis Fernando Cázares Bulbarela 26 febrero, 2013 at 12:25 PM

      Hola, estas usando la ventana modal de bootstrap?, la verdad no la he usado te sugiero uses jquery ui trae un evento close y ahí puedes realizar la tarea del vaciado.

      Saludos

      • Juan Nájera Mendoza 28 febrero, 2013 at 5:12 PM

        o.k., probare con jquery ui gracias por la ayuda, buen día !

        • Juan Nájera Mendoza 28 febrero, 2013 at 5:16 PM

          otra duda, no sabes como enviar ficheros o tag input de tipo file al mismo tiempo que input de tipo text !! ? gracias por tu atención !

          • Luis Fernando Cázares Bulbarela 28 febrero, 2013 at 10:31 PM

            Hola Juan, la teoría es que debes generar tu formulario con los campos necesarios, insertar el botón del ajaxupload y subir tu archivo al server, guardar el nombre de este en un campo oculto y después procesar el formulario como normalmente lo haces, pronto subiré un screencast con éste ejemplo práctico.

            Saludos

    • Ricardo 19 noviembre, 2014 at 3:43 AM

      Buenas noches Juan Najera y Luis Fernando, estaba apunto de realizar la misma pregunta para vaciar los datos del formulario utilizando la ventana modal de bootstrap y pues encontre este fragmento de codigo
      $(‘#myModal’).on(‘hidden.bs.modal’, function () {
      // colocar los elementos a vaciar acá $(‘#miform input[type=”text”]’).val(”);
      });

      lo extraí de la siguiente pagina, para que le den un vistazo.
      http://stackoverflow.com/questions/12319171/how-to-handle-the-modal-closing-event-in-twitter-bootstrap

      espero haber sido de ayuda.

      Saludos cordiales

      • Luis Fernando Cázares Bulbarela 19 noviembre, 2014 at 7:37 PM

        Hola muchas gracias por contestar, les comento que normalmente así es como lo hago o en su defecto hago un reload de la sección en la que tengo mi ventana modal, esto al término del proceso.

        Saludos

  25. Fred J. 6 marzo, 2013 at 12:19 AM

    hola luis buenas noches otra vez molestandote pero quisiera saber como implementar la opcion de eliminar asi como creas y editas en la tabla y con jqueri e lidia con eso pero no logro implementarlo ojala puedas ayudarme gracias de antemano .. saludos

  26. fredo J. 6 marzo, 2013 at 12:53 AM

    luis ayuda como implementar la eliminacion al igual que la creacion y edicion de este ejemplo gracias de antemano.. buenas noches

  27. Davinson 26 marzo, 2013 at 3:07 PM

    Luis me han parecido muy interesantes tus vídeos. En este video tutorial Al momento de hacer la actualización la estas haciendo con jquery, quisiera saber si puedes realizar esa actualización desde la base de datos con jquery ajax.
    Gracias …

    • Luis Fernando Cázares Bulbarela 26 marzo, 2013 at 9:12 PM

      Hola buenas noches, en este tutorial uso jquery ajax para actualizar mas no para extraer los datos de la db, supongo que lo qued eseas hacer es sacar los datos de una tabla y ponerlos en el form para su edición.

      Saludos

      • Davinson 27 marzo, 2013 at 8:37 PM

        Haa bueno muy cierto luis Lo que estas diciendo. Y quisiera saber si me puede colaborar con esa parte

        • Luis Fernando Cázares Bulbarela 27 marzo, 2013 at 10:47 PM

          Hola buenas noches, el próximo mes tratare de subir tutoriales de ese tipo de funcionalidad.

          Saludos

  28. Luis Montero 31 marzo, 2013 at 8:01 AM

    Debistes acercar mas el codigo a la camara para ver lo que escribias. Toma en cuenta esta sugerencia para los proximos videos…

  29. Fidel 8 abril, 2013 at 6:09 AM

    Hola¡ muy buena página, me gustaría saber dónde puedo descargar estos códigos.
    Saludos gracias Fidel

  30. Fidel 8 abril, 2013 at 11:18 AM

    Muy buenos tutoriales, encontré esta página hoy baje los códigos y me funciona todo, gracias.
    Me gustaría saber cómo borrar registros.
    Saludos
    Fidel

    • Luis Fernando Cázares Bulbarela 8 abril, 2013 at 10:12 PM

      Hola Fidel buenas noches, comunmente no borro registros, solo realizo un update y los marco en un campo como 1 activo o 2 desactivado.

      Saludos

  31. Fidel 13 abril, 2013 at 6:05 PM

    http://datagrid.comze.com

    Hola¡ aquí estoy haciendo un Grid con altas bajas y update, está funcionando todo, pero cuando muestra los registros, tengo que muestre 10 y los muestra todos, podrías ayudarme.
    Gracias

  32. Sebastián 19 mayo, 2013 at 6:32 PM

    Hola Luis, gracias por esta serie de posts, me han sido de mucha utilidad.
    Implementé la función jQuery AJAX $.ajax() tal como indicaste y funciona todo ok, excepto la carga del nuevo contenido sin refrescar la página. Es decir, todo funciona ok, los scripts, las validaciones, las consultas, los registros se guardan en la base, todo todo ok, pero no entiendo por qué no logro que una vez ingresado un registro se actualice automáticamente la página. Una vez que inserto, refresco el navegador y allí si logro ver los datos ingresados (el script está ok tal cual tu lo programaste). Te agradezco enormemente si pudieras ayudarme con esto.
    Te comento por las dudas, que integré la función en un cms que tengo en el que utilizo PHP PDO y modelo MVC. Quizá pueda estar por aquí el problema? Te comento esto, porque en otra carpeta instalé tu código tal cual y funciona perfectamente, incluso la actualización de página sin refrescar. Muchas gracias. Cordiales saludos desde Uruguay

    • Luis Fernando Cázares Bulbarela 19 mayo, 2013 at 7:39 PM

      Hola buenas tardes Sebastián, que gusto saber que mi trabajo te ayuda para tus proyectos, en cuanto a lo que me dices, posiblemente el mal funcionamiento radique en el id del contenedor de la tabla a la que se hace referencia para ir incrustando los registros sin regargar la página.

      Saludos

  33. dixon zamora 7 junio, 2013 at 12:03 AM

    Buenas noches, espero puedas ayudarme aprendiendo ajax ya se como guardar la informacion en una base de datos ahora necesito hacer una consulta de esa informacion y mostrarla en los input del formulario he estado buscando informacion pero no encuentro nada concreto espero puedas orientame al respecto

    • Luis Fernando Cázares Bulbarela 7 junio, 2013 at 10:30 AM

      Hola Dixon buenos días, gracias por tus amables comentarios, en este mes pienso sacar videos sobre ese asunto…

      Saludos

  34. […] versiones de estos, implemetarlos en nuestros desarrollos y con la ayuda de tutoriales como jQuery AJAX para Realizar Consultas con PHP y MySQL dar la funcionalidad para guardar información en una base de datos e inclusive enviarlos por […]

  35. Rodrigo 24 junio, 2013 at 9:45 AM

    Estimad Luis Fernando, excelente trabajo me ha servido mucho, pero tengo una consulta, si haras o puedes subir un tutorial de busquedas por criterios con la misma estructura programatica con la q hiciste este mantenedor pls te lo agradeceria mucho slds!!!

    • Luis Fernando Cázares Bulbarela 24 junio, 2013 at 10:16 AM

      Hola Rodrigo buenos días, muchas gracias por tus amables comentarios, te diré que lo tengo en mente pero no se como para cuando, si me permites un consejo, intenta hacerlo, picale, codeale y si tienes alguna pregunta no dudes en contactarme.

      Saludos

  36. Rodrigo 25 junio, 2013 at 8:32 AM

    Hola Luis, si eso hare este finde 😉 cualquier cosa te la comento por aca, gracias por tu atencion saludos!!!

  37. Jesús Eduardo 28 junio, 2013 at 1:23 PM

    Antes que nada muchas gracias por la información el tutorial está muy bien explicado, lo probé en localhost y funciona de lujo!, la cuestión surge cuando quise añadirle nuevos campos al formulario, coloqué un nuevo campo a manera de prueba, el detalle que no me deja editar usuario, si puedo dar de alta y borrar, en la parte del mainJava Script añadí esto:

    $(‘#nuevo_campo option[value=’+ $(this).parent().parent().children(‘td:eq(4)’).text() +’]’).attr(‘selected’,true);

    Es en la parte de EditUser, que podrá ser, por cierto los documentos de phpAjaxUSers y mainFunctions.inc tienen sus respectivas modificaciones para agregar un nuevo campo. Hasta luego y espero tu respuesta, gracias.

    • Luis Fernando Cázares Bulbarela 28 junio, 2013 at 2:40 PM

      Hola buenas tardes Jesús Eduardo, muchas gracias por tus amables comentarios, si no entiendo mal, lo que te falta es que ese campo se refleje en tu formulario, primero que nada debe aparecer esa información en la tabla del listado y posterior a eso debes ver en que indice esta ese campo.

      Si tienes alguna duda por favor contáctame.

      Saludos

  38. Jesús Eduardo 28 junio, 2013 at 2:43 PM

    Listo ya lo solucioné, era un error en la parte de edit user, era cuestión de sintaxis, no mandaba error pero no editaba, de antemano gracias.

  39. […] Leer entrada […]

  40. duver 30 agosto, 2013 at 9:40 AM

    saludos
    Me gustaria aprender hacer un login con distintos roles(administrador, aprendiz, cordinador, vigilante) y direccionar cada rol a una seccion diferente.
    Gracias.

  41. Eldelaguila77 2 septiembre, 2013 at 8:06 PM

    Hola una pregunta, dónde encuentro los archivos base de este proyecto? completo 🙂

  42. Adrian 21 septiembre, 2013 at 12:36 AM

    Hola que tal muy bueno tu video solo tengo una duda me puedes decir como se llenan los combos que te aparecen al llenar los datos tengo una aplicacion parecida pero no puedo llenar los combos porque se imprime directamente de un echo con php

  43. jaime barrientos 21 septiembre, 2013 at 2:49 PM

    Hola
    Te doy las gracias por tu paciencia y dedicación, muy buenos tus manuales de ayuda, llevo muchos años programando en php, mysql pero nunca había trabajado con ajax….realmente es una buena herramienta, actualmente debo hacer unos soft. y estoy pensando utilizar tus códigos de ejemplos, espero no te moleste, estos serán debidamente comentados anunciando a su creador.

    espero sigas….y mucha suerte.

    gracias

    • Luis Fernando Cázares Bulbarela 21 septiembre, 2013 at 6:32 PM

      Hola buenas tardes Jaime, muchas gracias, no te preocupes para eso es el código.

      Espero pronto me compartas elntrabajo realizado.

      Saludos

  44. jaime barrientos 24 septiembre, 2013 at 1:15 AM

    luis consulta

    ejemplo: en una ventana existiera un botón x — que al presionarlo una tabla actualice sus datos con los datos que envía el botón o el form….como puedo utilizar las librerías que enseñaste..

    gracias

    • Luis Fernando Cázares Bulbarela 24 septiembre, 2013 at 1:20 AM

      Hola Jaime buenas noches, si pudieras ser mas específico te lo agradecería, no comprendí muy bien lo que necesitas hacer, tal vez con un pantallazo o mockup te podría sugerir alguna solución.

      Por favor enviame la información a luis.f.cazares@gmail.com

  45. Ne0 4 octubre, 2013 at 12:00 AM

    Excelentes videos me gustaria que hicieras unos ejemplos de reportes con estas herramientas a pdf xD!!

    • Luis Fernando Cázares Bulbarela 4 octubre, 2013 at 10:21 AM

      Hola Ne0 muchas gracias por tus comentarios, estoy trabajando duro para poder tener mas tutoriales en breve, saludos

  46. Christian 4 octubre, 2013 at 12:23 PM

    consulta: xq cuando hago un include de php el jquery deja de funcionar?

    gracias por la respuesta!

    • Luis Fernando Cázares Bulbarela 4 octubre, 2013 at 2:55 PM

      Si el include lo haces con AJAX no te va a funcionar porque se actualiza el DOM, por otro lado debes verificar si estas incluyendo bien las librerías js.

      Saludos

  47. Zero 18 octubre, 2013 at 3:33 PM

    Dígame, ha compartido el proyecto por aquí? es decir en forma de descarga?.

    luego, felicitaciones, gran tutorial, justo tenía mis dudas sobre ajax, muchas gracias me será de mucha utilidad

  48. Daniel 30 octubre, 2013 at 8:41 PM

    Hola Luis Fernando, muchas gracias por tan valioso aporte! está muy bien realizado y bien explicado… asi que ahora practicaré mucho hasta lograrlo… te he enviado un mail pidiéndote la base de datos del ejemplo ya que no la encontré en la carpeta docs que mencionás en uno de los videos… gracias desde ya! Adicional, hay forma de que a la hora de editar un registro, solo algunas columnas puedan editarse y otras queden como están cargadas? Muchas pero muchas gracias! saludos!

    • Luis Fernando Cázares Bulbarela 30 octubre, 2013 at 8:48 PM

      Hola buenas noches Daniel, muchas gracias por tus comentarios, mañana sin falta te envío los datos.

      Saludos

  49. jose 7 diciembre, 2013 at 7:29 AM

    buenos dias amigo .. realmente muy buenos tus videos y muy educativos .. una pregunta . dosnde puedo desacargarlos .. ??? .. lo que pasa es mi coneccion es lenta y quiero verlos varias veces y asi poder afianzar los conocimientos .. te lo agradesco de verdad ..

  50. Yareth 6 enero, 2014 at 5:00 PM

    Hola, tengo una pequeña duda, al momento de recibir la respuesta del servidor con el resultado, tambien me arroja el código html del que lo estoy enviando, solo necesito recuperar el dato sin codigo html, pero ya no encuntro el error, me podrían ayudar por favor

  51. Mauro 6 febrero, 2014 at 8:45 AM

    Estimado, excelente y todo muy bien explicado, te quiero molestar si me puedes enviar las fuentes y la base de datos que no la logre encontrar, mi correo es arenas27@gmail.com
    Muchas gracias, saludos!!

  52. Mauro 6 febrero, 2014 at 9:43 AM

    bien, logre descargar el código y montarlo sin problemas, una consulta como puedo ajustar el ancho de la ventana emergente que sale para agregar y modificar??

    • Luis Fernando Cázares Bulbarela 6 febrero, 2014 at 10:44 PM

      Hola buenas noches Mauro en el archivo js/mainJavaScript.js encontrás el siguiente código:

      $('#agregarUser').dialog({
      autoOpen: false,
      modal:true,
      * width:305,
      * height:'auto',
      resizable: false,
      close:function(){
      $('#formUsers fieldset > span').removeClass('error').empty();
      $('#formUsers input[type="text"]').val('');
      $('#formUsers select > option').removeAttr('selected');
      $('#id_user').val('0');
      }
      });

      He marcado con un * las propiedades para que ahí modifiques las dimensiones de la ventana.

      Saludos

  53. Mauro 7 febrero, 2014 at 6:21 AM

    Excelente, sobre el mismo ejemplo estoy agregando un search y la paginación, muchas gracias

  54. Mauro 7 febrero, 2014 at 7:38 AM

    algún consejo para que la información quede en forma horizontal, con las cajas (input) ordenados y que el mensaje de error aparezca abajo ??
    Ejemplo
    Nombre
    Puesto

    Me complica un poco el tema de los estilo..espero me puedas ayudar, graciassss..

    • Luis Fernando Cázares Bulbarela 7 febrero, 2014 at 11:58 PM

      Ummmm debes consultar la documentación de bootstrap y jquery valida te ahí encontrarás información.

      Saludos

  55. Flavio 11 febrero, 2014 at 5:47 PM

    buen dia podrias decirme para editar llamar varios campos de la tabla con jquery me gusto el ejemplo que hiciste poruqe tu lo hiciste solo con llamar los campos q estan ahi

  56. Flavio 11 febrero, 2014 at 5:50 PM

    podrias decirme para editar llamar varios campos de la tabla con jquery me gusto el ejemplo que hiciste poruqe tu lo hiciste solo con llamar los campos q estan ahi

    • Luis Fernando Cázares Bulbarela 13 febrero, 2014 at 2:47 AM

      Hola buenas noches flavio, te comento que en breve estaré produciendo nuevos videos y entre estos se encuentra lo que necesitas.

      Saludos

  57. Flavio 11 febrero, 2014 at 5:59 PM

    Podrias decirme como editar varios registros con jquery primero traer los registros y luego editar te lo agradeceria mucho

  58. Abel 12 febrero, 2014 at 7:50 AM

    Muy buenos videos y también excelente explicación, te comento que estoy utilizando tu código como ejemplo para crear un “leer mas” en un módulo de noticias, me explico, en la pagina principal se ven las noticias “cortas” y al hacer click sobre el “leer mas” se abre un popup con la noticia completa (a grandes rasgos es muy similar a lo que tu realizas al momento de querer editar un campo de la base de datos), ahora, el punto en el cual estoy trabado es el siguiente:

    En mi base de datos tengo un campo en el cual guardo la noticia completa con etiquetas html y cuando lo llamo para que se imprima en la ventana emergente, imprime solo el “texto” de la noticia.

    Lo que estoy intentando hacer, es que la noticia se imprima dentro de un respetando todas las etiquetas html que contiene, (es decir, el estilo), agradecería muchísimo algún consejo que me puedas dar.

    De antemano muchas gracias.

    • Abel 12 febrero, 2014 at 9:32 AM

      Dentro de un Parrafo ( )

    • Luis Fernando Cázares Bulbarela 13 febrero, 2014 at 2:45 AM

      Hola buenas noches Abel, muchas gracias por tus amables comentarios y seguir mi trabajo, en cuanto a la duda supongo que esa información la pasas por medio de una variable en twig de la siguiente forma {{ noticia }} la cual contiene etiquetas HTML, y si pruebas escribiendo así {{ noticia|raw }}

      Saludos

      • Abel 13 febrero, 2014 at 6:53 AM

        Muchas gracias por tu pronta respuesta Luis, estuve investigando acerca de lo que me recomendaste y creo que no me sirve (creo), twing esta relacionado con el framework Symfony y yo estoy utilizando bootstrap, es más, me estoy basando exclusivamente en este video “Video 11 Creación de interacción para edición de registros y actualización de lista de usuarios”. Estoy reemplazando el boton de “editar” por uno que se llame “Ver” y que cumpla exclusivamente esa función. Saludos

  59. José Andrés Martínez 15 febrero, 2014 at 5:42 PM

    Excelente serie de videos, realmente no hay desperdicio. Aprendí un montón, espero que siempre sigas con esos deseos de compartir tus conocimientos. Gracias mil.

  60. Erickson Carreño 6 marzo, 2014 at 3:01 PM

    Hola luis muy bueno el tutorial pero antes de seguirlo completamente quería probar el código para ver si lo que enseñas es también lo que necesito para mi aplicación. descargue tu código del repositorio pero no veo la bd para poder probarlo..

    Gracias

  61. Nacho 12 marzo, 2014 at 8:30 AM

    Muy bueno el tutorial lo que si me parece que a la hora de publicar el video de editar registro de cliente sería conveniente que lo hagas mediante $.ajax consulta a la base de datos para extraer los campos para llenar el registro ya que es muy raro que vos muestres en el formulario editar los mismos datos que tenes en la tabla. Abrazo.

    • Luis Fernando Cázares Bulbarela 15 marzo, 2014 at 1:31 AM

      Hola buenas noches Nacho, en breve estará saliendo esta serie, te invito a suscribirte a mi newsletter para que recibas la notificación…

      Saludos

  62. Formulario dinámico jQuery con AJAX y PHP 18 marzo, 2014 at 1:17 AM

    […] el tratamiento de información por medio de formularios que conocemos como dinámicos. En la serie jQuery AJAX para Realizar Consultas con PHP y MySQL aprendimos como realizar este tipo de interacciones. En el video 11 – Creación de interacción […]

  63. Ruben Dario Chirinos Rodriguez 20 marzo, 2014 at 8:51 PM

    hola amigo como estas excelente ese tutorial en verdad me gusto mucho te felicito, sera que podrias pasarme esos codigos porq necesito hacer esa consulta y actualizarla de la manera como tu lo explicas te lo agradeceria muchas gracias

    • Luis Fernando Cázares Bulbarela 21 marzo, 2014 at 1:35 AM

      Hola buenas noches Rubén, los puedes encontrar en: https://github.com/CazaresLuis/jQuery_AJAX_para_Realizar_Consultas_con_PHP_y_MySQL Saludos

  64. Erickson Carreño 26 marzo, 2014 at 7:31 PM

    Hola amigo, yo nuevamente.. sabes que cuando instale tu codigo que esta muy bueno por cierto, al abrirlo me sale de una vez error al conectarse a la base de datos y luego cuando intento agregar un usuario me sale error general del sistema intentelo mas tarde.. porque crees que sucede esto? me ayudas por favor

  65. Erickson Carreño 26 marzo, 2014 at 7:34 PM

    ah y otra cosa cuando le doy agregar usuario, de una vez tambien se sale dando vuelta el espere un momento porfavor como si ya le hubiese dado al boton

  66. Erickson Carreño 26 marzo, 2014 at 7:54 PM

    Bueno amigo si quieres ya no apruebes los comentarios anteriores, ya he podido solucionar el problema, cometi un error de novatos que fue no cambiar el usuario de mysql y por ello arrojaba el error pero ya esta listo.. muy buen codigo.. (y)

  67. Juan 23 abril, 2014 at 9:02 PM

    Que tal amigo?
    Espectacular esta el tutorial!! Pero tengo un problema, funcionaba todo perfectamente, hasta que segui las intrucciones tal cual estan en el video 10 pero no funciona. Al insertar un registro me dice “ERROR GENERAL DEL SISTEMA” lo cual me dice que no funciona el ajax. Cual puede ser el problema? Me podes ayudar por favor

    • Luis Fernando Cázares Bulbarela 23 abril, 2014 at 9:54 PM

      Hola Juan buenas noches, muchas gracias por seguir mi trabajo, el error debe estar en tu php, comúnmente es por cambio de nombres de variable o errores de sintaxis.

      Saludos

  68. Carlos Mejia 6 mayo, 2014 at 3:56 PM

    Buenas tardes Luis, muy buenos tus tutoriales, los he seguido y me parecen muy didacticos, en este momento estoy tratando de validar un formulario que esta en una ventana modal con el plugin jquery validate pero tengo problemas con la validación con los metadata, cuando hago el submit me muestra la serializacion de los campos pero no me muestra ningun mensaje de error de las casillas… te agradeceria mucho la ayuda

    • Luis Fernando Cázares Bulbarela 6 mayo, 2014 at 5:42 PM

      Hola buenas tardes Carlos, muchas gracias por tus amables comentarios, te sugiero utilices la nueva versión del plugin, ya no utiliza el metadata, esta mas sencillo.

      Saludos

  69. Carlos Mejia 6 mayo, 2014 at 9:42 PM

    Hola Luis, saludos desde Venezuela, muchas gracias por tu pronta respuesta.
    te adjunto el codigo que implemente:
    $(function(){
    //Creacion de ventanas con formulario con jQuery UI
    $(‘#addMateriales’).dialog({
    autoOpen:false,
    modal:true,
    width:600,
    heigth:’auto’,
    close:function(){
    $(“#formMat input[type=’text’]”).val(”);
    $(“#formMat textarea[type=’text’]”).val(”);
    $(‘#formMat select > option’).removeAttr(‘selected’);
    },
    show:{
    effect: “blind”,
    duration: 1000
    },
    hide:{
    effect: “explode”,
    duration: 1000
    }
    });

    //Funcionalidad del boton que abre la ventana de dialogo
    $(‘#goNuevoItems’).on(‘click’,function(){
    $(‘#addMateriales’).dialog(‘open’);
    });

    //Validar Formulario
    $(‘#formMat’).validate({
    rules:{
    items_accion:{
    required:true
    },
    items:{
    required:true
    },
    nombre:{
    required:true
    },
    descripcion:{
    required:true
    },
    unidad:{
    required:true
    },
    cantidad:{
    required:true
    },
    costo:{
    required:true
    }
    },
    errorPlacement:function(error, element){
    error.appenTo(element.prev(“span”).append());
    },
    submitHandler:function(){

    }
    });

    //Datepicker para aparecer calendario
    $(‘#fecha’).datepicker({
    inline: true,
    //dateFormat: “d-mm-yy”
    dateFormat:”yy-mm-dd”
    });

    });

    Si utilizo el codigo con solamente las reglas, el plugin validate funciona, pero no puedo ubicar los errores en los contenedores , y cuando implmento
    errorPlacement:function(error, element){
    error.appenTo(element.prev(“span”).append());

    el formulario realiza el submit y se cierra la ventana modal sin pasar por la validación.

    Te agredeceria mucho todo el apoyo que puedas prestarme…..

  70. Angel 18 julio, 2014 at 12:21 PM

    Me gustaría que me explicaras como le haria con las nuevas versiones de los archivos, es un lio pues todos se descargan con nombres diferentes y no se sabe cual es cual, ademas de que bootstrap ya ni siquiera tiene esa version. Por tu ayuda gracias.

    • Luis Fernando Cázares Bulbarela 18 julio, 2014 at 12:27 PM

      Hola buenas tardes Angel, muchas gracias por seguir mi trabajo, te comento que he iniciado una serie de tutoriales para desarrollo web con Silex y pretendo hacer este mismo curso pero ya con las nuevas versiones aquí el link Curso de Silex – Introducción

      Saludos

  71. Angel 18 julio, 2014 at 12:29 PM

    Me interesa me pudieses proporcionar el codigo fuente, estamos desarrollando un proyecto y aprendiendo a la vez, porfavor seria una grandisima ayuda. Excelentes videotutoriales.

  72. Angel 18 julio, 2014 at 12:35 PM

    Voy a checar el de Silex, muchas gracias. y reiterando que buenos tutoriales. si pudieras proporcionarme el codigo fuente de ajax, php y javascript, pero bueno es tu decisión. gracias y ahorita me aviento Silex. gracias

  73. Angel 18 julio, 2014 at 12:51 PM

    Gracias muy amable…esperaremos los videotutoriales..Gracias. Estamos en contacto, voy egresando de ing. informatica aun me falta un poco pero ya mero. y me interesa mucho aprender lo maximo posible. Gracias.

  74. amado 27 julio, 2014 at 6:29 PM

    Me ha sido de mucha utilidad el tutorial, nadie podia hacer lo que tu hiciste(de las personas que conozco)

  75. Jorge 10 septiembre, 2014 at 5:59 PM

    Luis no tendrás el código zipeado para descargarlo

    Gracias

  76. Cristian 23 septiembre, 2014 at 3:12 AM

    Yo estoy intentando hacer un login con Jquery, PHP y MySQL pero tengo un fallo, al poner un usuario que no existe, no registrado, se puede hacer login si o si.

    • Luis Fernando Cázares Bulbarela 23 septiembre, 2014 at 10:44 PM

      Hola Cristian, checa tus validaciones posiblemente tu if no tenga el == o el query este incorrecto.

      Saludos

  77. David Reyes 15 octubre, 2014 at 6:51 PM

    Excelente, aunque tengo un problema.
    Cuando intento cargar un luego de actualizar (debido a cierta modificación que hice para adaptar este método a mi necesidad), no me permite pero si pongo varios ahi si puedo.

    No funciona:
    $resultado = $this->consulta (“SELECT * FROM series where seri_Num = ‘”.$icc.”‘ ORDER BY seri_ID DESC”);

    Funciona:
    $resultado = $this->consulta (“SELECT * FROM series ORDER BY seri_Id ASC”);

    Aclaro que sí se ejecuta el codigo y al hacer una prueba directamente al procesador .php me muestra los datos:
    {“respuesta”:true,”mensaje”:”Se ha actualizado el registro correctamente”,”contenido”:”\n \n SimCard Activaci\u00f3n Pospago \n 5465213216546513212\n Pasaje \n Reservado \n Editar \n 2 \n 2 \n 0 \n \n “}

    Pero nunca llega a json el contenido. El resto llega.
    Pero si envío mediante contenido un texto plano. Llega tranquilamente.

    Gracias por cualquier ayudita

    • Luis Fernando Cázares Bulbarela 16 octubre, 2014 at 10:49 PM

      Hola buenas noches David, gracias por seguir mi trabajo y preguntar, te sugiero que en lugar de hacer un query para la recarga simplemente hagas con el javascript window.location.reload(), con esto realizar el proceso inicial de tu sección y listo.

      Saludos

  78. jose 6 noviembre, 2014 at 9:55 PM

    hola buenas noches he seguido tu trabajo y lo estoy implementando en un sistema quisiera saber como podria poner las tablas dentro de diferentes navs de bootstrap o si se pueden crear diferentes funciones para rellenar las tablas por cada nav de ante mano gracias

    • Luis Fernando Cázares Bulbarela 7 noviembre, 2014 at 10:56 PM

      Buenas noches José, lo que quieres hacer es llenar las tablas con AJAX o como es el procedimiento no me queda muy claro.

      Saludos

  79. jose 11 noviembre, 2014 at 9:48 PM

    exacto es lo que quiero rellenar las tablas con ajax asiendo diferentes consultas en la base de datos pero la pregunta es si no causaria conflicto al ponerlas en los tab de bootstrap esto simulando un menu

    • Luis Fernando Cázares Bulbarela 12 noviembre, 2014 at 9:52 AM

      Hola buenos días José, es muy sencillo, recuerda que en esto de la programación todo se puede, es cuestión de probar y probar y armar el mejor código para que las cosas sucedan.

      Saludos

  80. javier 4 diciembre, 2014 at 7:50 AM

    donde puedo ver los 12 videos de este tutorial?

  81. Pablo Santiago 19 diciembre, 2014 at 6:51 PM

    Hola que tal Luis! Creo que he llegado un poco tarde, ya que no puedo accesar a tu github me marca error y empiezo con esto de php+mysql y jquery, me podrías apoyar si es posible con el código, me ha agradado tu página y tu manera de explicar.

    Saludos desde México.

    Gracias por tu tiempo.

    • Luis Fernando Cázares Bulbarela 19 diciembre, 2014 at 9:06 PM

      Hola Pablo buenas noches, claro que sí este es el link jQuery AJAX
      Saludos

      • Pablo Santiago 21 diciembre, 2014 at 9:18 AM

        Gracias Luis, seguiré el tutorial y me apoyaré con los archivos, gracias nuevamente. Saludos

  82. sebastian 21 diciembre, 2014 at 12:59 PM

    amigo me gusto tus tutooriales , pero tengo una duda , como hago todo esto pero con una sentencia WHERE, Y CON UNA VARIABLE , PARA BUSCAR UN DATO CONCRETO, muchas gracias

    • Luis Fernando Cázares Bulbarela 26 diciembre, 2014 at 9:11 AM

      Buenos días Sebastian, básicamente lo que tienes que hacer es agregar a tus consultas la clausula where tomando alguno de los campos que traes en tu form.

      Saludos

  83. darwin 8 enero, 2015 at 9:13 AM

    donde se pueden descargar los archivos para probar la aplicacion

  84. Gerardo 13 enero, 2015 at 3:21 PM

    hola, ¿este tutorial sirve con las versiones nuevas?

    • Luis Fernando Cázares Bulbarela 14 enero, 2015 at 9:39 AM

      Hola Gerardo buenos días, en la programación de php sin problemas, no así para los frameworks de javascript y css, pero logrando hacer esto, migrarlo debería ser cosa sencilla.

      Saludos

  85. Edgardo 19 enero, 2015 at 9:32 PM

    Hola, te quería hacer una consulta, tome este tutorilal como ejemplo, tengo que hacer varios ABM el tema es que uno
    es en una tabla que no tiene 3 campos como en el ejemplo, son como 25, y mi duda es como me conviene cargar la grilla para que sea mas optimo.
    en mi caso la idea es en la grilla con todos los registros voy a tener 3 o 4 campos visibles como en el ejemplo, ahora para la edición me conviene cuando cargo la pantalla inicial con la grilla recupero todos los campos de todos los registros y los dejo ocultos los que no quiero mostrar en la pantalla para después recuperaros cuando abro el dialog para editar, o es mas optimo cuando hago click en editar recuperar de la DB todos los campos del registro a editar, mi miedo es que si cargo todos los campos de entrada sea muy lenta la carga inicial de la tabla.

    esta muy bueno el tutorial, seguramente también mire el de upload de archivos y el de paginado.

    muchas gracias y muy buena la pagina y los tutoriales.

    Saludos y muchas gracias.

  86. Luis Ferrer 21 enero, 2015 at 3:42 PM

    Que tal Luis Fernando, primero una felicitación por tus tutoriales los cuales tienen una gran calidad, mi reconocimiento. Por otra parte, quisiera hacerte una pregunta o mejor dicho solicitarte una recomendación, estoy desarrollando una aplicación en flash + php + mysql para convertirla en app para ejecutarla en dispositivos con android, es una especie de juego para 4 usuarios que tienen q estar interactuando con una misma base de datos local, ya tengo comunicación BD-APP, pero tengo un problema, la respuesta a mis peticiones php-mysql es lenta y no le da aguilidad al juego, crees conveniente poder aplicar algo de este tutorial (Jquery, AJAX, etc) o debo implementar otra forma para estar interactuando con la BD. De antemano muchisimas GRACIAS¡¡¡

    • Luis Fernando Cázares Bulbarela 21 enero, 2015 at 6:03 PM

      Hola buenas tardes Luis, la verdad es que no tengo mucho conocimiento en el desarrollo de aplicaciones para android pero, se que hay tecnologías modernas muy robustas como Apache Cordoba, Angular Js y tengo entendido que usan una base de datos como SQL Lite de forma local.

      Saludos

  87. […] jQuery AJAX para Realizar Consultas con PHP y MySQL […]

  88. Lalo Landa 5 marzo, 2015 at 3:49 PM

    Hola que tal, gracias por el aporte y tengo una duda, espero puedas ayudarme:

    Estoy creando un menu responsive multinivel para acceder a unos dispositivos, pero se puede dar de alta cada uno de los niveles y subniveles con PHP e insertarlos en HTML para visualizar al momento de hacer la consulta con MySQL?

    He visto varios tutos y hablan de utilizar jQuery o DOM aunque no he utilizado ese tipo de herramientas.

    Gracias por todo!

    • Luis Fernando Cázares Bulbarela 6 marzo, 2015 at 10:28 PM

      Hola buenas noches Lalo, muchas gracias por consultar mi blog, con respecto a tu pregunta no me queda muy claro que deseas hacer, no se si puedas ser mas específico.

      Saludos

  89. Mauricio 8 abril, 2015 at 3:17 PM

    Interesante y de mucha ayuda, una duda, una duda tengo que llenar etiquetas html con datos de una base de datos, es válido y conveniente hacer esto utilizando jquery o utilzar directamente php?
    Saludos

    • Luis Fernando Cázares Bulbarela 8 abril, 2015 at 5:19 PM

      Hola buenas tardes Mauricio, muchas gracias por seguir mi trabajo, en cuanto a la pregunta que me haces es importante destacar que php es para programar del lado del servidor y realizar interacción con tus bases de datos, jQuery es una librería javascript que te permite realizar funcionalidades del lado del cliente por así decir modificar tus vistas y en determinado momento realizar llamadas al servidor de forma asíncrona mejor conocida como AJAX. Debes definir que es lo que deseas hacer para no perderte en el camino.

      Saludos

  90. Kau 8 abril, 2015 at 5:03 PM

    Hola, por favor podrían decirme cual es la petición de ajax para extraer datos de una base de datos?

  91. Kau 8 abril, 2015 at 6:26 PM

    muchas gracias 😉

  92. Wendy 21 abril, 2015 at 1:16 PM

    Hola estoy desarrollando una aplicacion web donde estoy utilizando Laravel y la api de google maps pero me hace falta una peticion ajax para que extraiga los datos (Latutud y Longitud) para que agreguen los marcadores en el mapa automaticamente. alguien podria ayudarme .????

  93. guido 9 mayo, 2015 at 9:34 PM

    hola luis fernando gracias por los tutoriales que son de mucha ayuda, estoy desarrollando una aplicacion web y tengo un problema

  94. guido 9 mayo, 2015 at 9:37 PM

    el problema que tengo es que cuando ingreso informacion a mi base de datos en mi ventana modal donde muestro los registros que tengo en dicha tablas no me apararece la informacion recien ingresada para que me aparesca tengo que recargar la pagina, si me pudieras ayudar te lo agradeceria muchisimo.

  95. alejandro dorado 27 mayo, 2015 at 11:53 AM

    amigo es que tengo que hacer un carrito de compras… me comentaron que lo que necesito lo puedo hacer con jquery lo que quiero hacer es ……. tengo una basee de datos en el cual tengo productos.. esos productos los tengo divididos por categoría.. mi pregunta es necesito sacar esos productos en la pagina principal con imágenes y que tengan un botón de agregar al carrito pero quiero que cuando el cliente entre esten los productos en la pagina principal los mismo productos de la base de datos.
    gracias me serviría de mucha tu ayuda

    • Luis Fernando Cázares Bulbarela 27 mayo, 2015 at 11:01 PM

      Buenas noches Alejandro, entiendo lo que quieres hacer y son procesos algo complejos que requieren de cierto dominio de la programación, mucho de lo que ves en este tutorial podría aplicar para lo que deseas hacer.

      Saludos

  96. Mario 3 junio, 2015 at 7:01 AM

    Hola Luis, estoy haciendo un proyecto con bootstrap y utilizando modales, necesito que en cada modal que aparezca reciba los datos de unas tablas mysql que tengo en un entorno php. El metodo jquery ajax sigue siendo practico para recibir datos envede para enviarlos como puede ser un formulario. Mi intencion es solo mostrar los datos en la ventana modal.
    Gracais de antemano por tu atención y dedicación.
    Saludos!!!

  97. darwin 23 junio, 2015 at 10:01 AM

    hola luis, me gusto mucho este tutorial pero donde puedo descargar los archivos?
    saludos

  98. Angel Lopez 3 octubre, 2015 at 10:40 AM

    Hola Luis, primero felicitarte por este gran aporte y otros de similar ayuda, mi consulta es, si tuvieras algun tutorial acerca de reportes de las bases de datos en pdf y un pequeño generador de codigo de barra en el mismo reporte, muchas gracias de antemano y Felicitaciones por tu noble labor…

    • Luis Fernando Cázares Bulbarela 3 octubre, 2015 at 4:41 PM

      Hola buenas tardes Angel muchas gracias por seguir mi trabajo, te comento que en la actualidad utilizo tcpdf para crear archivos como los que necesitas.

      Saludos

  99. Richard 27 marzo, 2016 at 4:05 PM

    Hola Luis, muy buen tutorial admiro tu trabajo se ve bien explicado paso a paso, mi consulta seria como podria a ese ejemplo ponerle paginacion y busqueda, si tuvieras un ejemplo pasate el link para poder adaptarlo a este que funciona muy bien gracias de antemano y seguire al tanto de tus tutoriales.

    • Luis Fernando Cázares Bulbarela 10 abril, 2016 at 4:55 PM

      Hola de momento no tengo links de ejemplos de este tipo pero puedes ver datatables te ayudaria mucho.

      Saludos

  100. Stephania 24 octubre, 2016 at 9:22 PM

    hola, que tal?
    He estado siguiendo tus tutoriales y me han servido bastante, gracias por compartir conocimiento
    pero tengo una duda,yo estoy manejando bootstrap 3 y al poner sus librerías no me funcionan, al momento de dar click en el boton de agregar no me muestra nada mas que el texto de “agregar usuario”, de igual manera con el de editar
    como le puedo hacer para que funcione en bootstrap 3? es que estoy manejando otros elementos como cabeceras y pues funcionan con esa versión de bootstrap,ojala me pudieras ayudar, me urge

  101. Cesar Romo 25 octubre, 2016 at 11:37 AM

    Hola Luis Fernando, en realidad no he tenido oportunidad de ver el tutorial completo solo he visto un par de videos, buscando en diferentes partes, blog , foros de programadores y demas he ido encontrando la solucion a algunos de mis problemas, pero como siempre no falta que algo falle, te comento a groso modo. Tengo una “aplicacion” si le podemos llamar asi, con una BD en Mysql con mas de 4000 registros, de aqui hice un formulario que al realizar la consulta segun lo que consultes (Nombres, apellidos, un numero) te puede arrojar un resultado o varios, se genera una tabla donde utilizo dataTables + bootstrap, lo que le da una vista sensacional, a partir de este punto tengo 3 botones por cada registro que aparezca en la tabla, al pulsar en alguno de los botones lanza una ventana modal, con datos basicos del usuario, y en este punto al hacer clic en otro boton despliega una nueva ventana modal, donde carga valores desde la BD, en caso de encontrarlos, si no, regresa los campos “vacios” en cero. Ahi puedo modificar le contenido de los campos que serian “horas, calificacion y una fecha” sin problema, e intento enviar de regreso esos valores a la BD y ahi es donde no pasa nada. estoy utilizando este proceso de envio via ajax:
    $(function() {
    //bootstrap script
    $(“button#guardar_calificacion”).click(function(){
    $.ajax({
    type: “post”,
    url: “guardar/update_dos.php”,
    data: $(‘#calificar’).serialize(),

    success: function(msg){

    $(“#modal_body2”).modal(‘hide’);
    bootbox.alert(“Datos Guardados Exitosamente!”, function() {
    console.log(“Alert Callback”);
    //location.reload();
    });

    },
    error: function(){
    bootbox.alert(“Error al Guardar!”, function() {
    console.log(“Alert Callback”);

    });
    },
    });
    });

    });

    Solo que no envia ningun valor, no me marca ningun error, nada no pasa nada, solo me despliega la ventana que los datos se han guardado exitosamente, cuando no es asi, y en teoria deberia desplegar el mensaje de error.

    Se te ocurre alguna otra manera de enviar estos datos a la BD.

    De antemano gracias

    Saludos

    • Luis Fernando Cázares Bulbarela 31 octubre, 2016 at 1:19 PM

      Hola buenas tardes César veo que utilizas bootbox y la sugerencia es que utilices callbacks en los botones de este, lo vas a lograr de mejor forma.

      buttons: {
      success: {
      label: "Si",
      className: "btn-success",
      callback: function() {

      }
      },
      main: {
      label: "No",
      className: "btn-primary"
      }
      }

Comments are closed.

Desarrollo Web

Silex - Sistema de Registro