0

DataTables JQuery com PHP

imgresImplementando o plugin DataTables do JQuery com PHP.

Nesta postagem segue um exemplo de implementação do plugin DataTable do JQuery integrado com o PHP. O plugin DataTable é uma ótima solução na hora de exibir uma lista de informações, a mesma possibilita ao usuário uma melhor navegação e organização dos dados. Segue a implementação de uma forma simples de uso deste plugin.

Javascript

No fonte acima realizo o import do plugin dataTable e do jquery e configuro o meu dataTable para ser associado a um elemento com o id “#example”, passando para o mesmo os seguintes parâmetros: aaSorting (ordem da lista), bPaginate (exibe a paginação), bFilter (exibe o filtro), sType (idioma do plugin), aoColumns(tipo das colunas da table, neste item devem ser definidas todas as colunas).

PHP

Por fim segue a tabela com os dados paginados.

dataTable

Baixe o plugin no site oficial: https://datatables.net/

0

Máscaras em Campos com JQuery

imgresMáscaras em Campos com JQuery

Em continuação do a postagem anterior, segue um exemplo de criação de máscaras de entrada para campos com o uso do JQuery. Segue alguns exemplos criados para ilustrar o uso da biblioteca maskedinput. Lembrando que está biblioteca está ligada a criação de máscara para validar usamos a validate como no exemplo da postagem anterior. Segue um exemplo de uso da biblioteca:

 Com simples uso da função mask() atribuída a um determinado campo do formulário podemos criar um padrão de máscara de entrada para o mesmo. Segue uma aplicação prática do fonte:

Confira como ficou:

mascaras

 

0

Validação de Campos com JQuery

imgresValidação de Campos com JQuery

Nesta postagem segue um exemplo de validação de campos de um formulário html com o uso do Jquery. Primeiramente vamos ao escopo do nosso formulário, tentei montar um formulários com campos bem distintos que cabem a validação de seu preenchimento.

Como podemos ver no formulário acima podemos validar: preenchimento de campos, tipos de dados como data e inteiro, url, telefone, celular e email. Neste exemplo faço uso da versão 1.3 do JQuery e do JQueryValidate disponível no site oficial do framework. (http://www.jquery.com).

Na hora de implementar as validações faço uso do param rules para definir as regras e do param messages para definir os alertas de validação. Segue o script de validação:

 Na versão usada do JQuery não existe um padrão de telefones para o Brasil e para atender ao padrão de números de telefone e celulares inseri o script a seguir no final do arquivo jquery.validate.js. Segue a implementação da validação de telefones do Brasil.

Ao fim a implementação teremos um formulário semelhante a este:

 

formulario_exemploClique Aqui, para fazer download dos fontes deste tutorial.

Jquery Validacao Wcf (27.4 KiB, 359 downloads)