jQuery Datatables sDom – Custom Elements

jQuery Datatables

This post is the next part of Working with the jQuery Datatables plugin. Since this tutorial is written for those familiar with the plugin You might need to learn the basics of the plugin on the following link http://behstant.com/blog/jquery/datatables-jquery-implementation/. On this tutorial I am going to focus on how to manipulate the elements of the Datatables by using the sDom property. In the first place you need to know that the plugin jQuery Datatables have 4 visual core elements:

  1. Number of items to Display.
  2. The main table.
  3. Number of records retrieved.
  4. Paginator.

Since these elements are visual you can put them in different positions or perhaps you can decide to set them visible or not, however, remember that not adding information into this property will result in a working DataTable using the default settings.

Read more

kokoroDB – PHP database Library

logo_01kokoroDB is library that I have created to interact with the Database. This library will free the developers from the tedious work of prepare statements, binding variables and more. So far the library allows you to select and insert information, works with PHP PDO, and store the error messages on an array.

More settings and capabilities will be added on the future like:

Read more

Search with Ajax and jQuery UI Autocomplete, PHP, MySQL and JSON

Autocomplete Example
Autocomplete Example

I have been creating posts with scripts to do small stuff, but on this post I would like to show/teach you how to implement the jQuery UI Autocomplete Widget. I have to remark that for the style of the application I am using Bootstrap, so the most important thing is the html code of the form and the Javascript code. This is the Part 1 of the tutorial.

I would like to show you a diagram of the application flow so click it to enlarge.

jQuery UI Autocomplete flow
jQuery UI Autocomplete flow

As you can see the application will load the information when the page loads, this is why the tutorial is Part 1, on further tutorial the information will not be loaded until the user type the information to search. Now, the code.

Read more

Ajax usage to search a Record with PHP, MySQL and jQuery

I have created a few post about how to Search, Update and Delete data from a MySQL Database with PHP and PDO. Those tutorials are quite simple (but not dynamically enough, they don’t use Ajax), but they are very important to catch the flow of this tutorial if you have never worked with this technologies. The tutorials are in Spanish so if you really need them in English I will be glad to translate them.

Something that I would like to remark is that you can get the scripts at the end of the tutorial.

In order to create a nice look and feel to the page I have implemented the framework Boostrap, but if you don’t want to focus on the look and feel you only have to focus on the Form, the event to Fire the Ajax request and the server to process your request.

The next flow chart will show the path that we are going to cover to complete our Ajax search:

Read more

Actualizar un registro con PHP (PDO,MySQL)

Esta es la continuación de la serie de tutoriales sobre PHP y base de datos con MySQL.

En esta ocación vamos a trabajar en la plantilla que obtuvimos en Crear Tabla HTML con ID y Mostrar Información (PHP,MySQL)

A esta plantilla le vamos a aplicar un poco de estilo para que este mas ordenana. El código de la nueva tabla se encuentra en el archivo completo del código fuente de este post, que lo puedes encontrar mas abajo.

Para poder actualizar nuestro registro debemos obtener los datos de la forma y formar nuestro query. Si ya seguiste el tutorial Método PDO::prepare Obtener Resultados con Parametros ya tienes una idea de que trata el enviar información a un query de una manera segura. Para este tutorial no hay mucha diferencia en cuanto al código, sin embargo, se implementa un método para verificar que se haya hecho la inserción de una manera correcta.

1.- El primer paso que tenemos que hacer es verificar que se haya seleccionado el boton de “Actualizar”, como esta dentro del post de la forma vamos a buscar que exista este boton en el arreglo $_POST:

Read more