Grade dinâmica Flexigrid com JQuery e PHP

Flexigrid com consultas pHp e MySQL

Flexigrid é uma biblioteca JQuery aberta e gratuita, que permite exibir o resultado de uma consulta de dados em uma grade, listá-los em uma tabela, paginá-los, classificá-los e interagir com os dados. Flexigrid pode usar diferentes fontes de dados como XML, consulta o banco de dados usando PHP e retorna os dados no formato JSON para serem exibidos pelo Flexgrid.

Podemos baixar o Flexigrid de seu site oficial.

Como usar Flexigrid com consultas pHp e MySQL


Após o download do Flexigrid, descompactamos o arquivo zip, em seguida, em um servidor local ou remoto como vimos no tutorial para instalar o Xampp para transformar seu computador em um servidor web, criaremos uma pasta para conter o exemplo, precisamos do CSS e Pastas JS que são as livrarias Flexigrid.

Você também deve ter uma versão jQuery, podemos usar uma versão online como:

 
Também podemos baixar a versão no site oficial jQuery.com. jQuery é uma biblioteca de funções JavaScript.

Em seguida, vamos criar um banco de dados do phpmyadmin para usar no exemplo

Banco de dados: `FlexEmpresa`

 CRIAR BASE DE DADOS SE NÃO EXISTIR `FlexEmpresa` DEFAULT CHARACTER SET latin1 COLLATE latin1_swedish_ci; Estrutura da tabela para a tabela `clientes` CREATE TABLE IF NOT EXISTS` customers` (` id` int (11) NOT NULL, `name` varchar (100) DEFAULT NULL,` address` varchar (255) NOT NULL, `city` varchar (255) NÃO NULO, `província` varchar (150) PADRÃO NULO) MOTOR = MyISAM AUTO_INCREMENT = 7 PADRÃO CHARSET = utf8;
Despejo de dados para a tabela `clientes`
 INSERIR EM `clientes` (` id`, `nome`,` endereço`, `cidade`,` província`) VALORES (1, 'Adela Resjez', 'Lore de Balca 435', 'Madrid', 'Madrid') , (2, 'Gretel Martinez', 'Juan XXIII 1232', 'Barcelona', 'Barcelona'), (3, 'Olivia Asri', 'Marina Sur 123', 'Aranjuez', 'Madrid'), (4, 'Ledi Widaya', 'Calle 1 Norte 456', 'Sabadell', 'Barcelona'), (5, 'Alfonso Praudi', 'Salerno 48 Piso 1', 'Valencia', 'Valencia'), (6, 'Jose Albertez ',' Calle 13 586 ',' Sevilla ',' Sevilla '); Índices da tabela `clientes` ALTER TABLE` clientes` ADD PRIMARY KEY (` id`); ALTER TABLE `clientes` MODIFY` id` int (11) NOT NULL AUTO_INCREMENT, AUTO_INCREMENT = 7; 

Em seguida, devemos criar um arquivo index.php onde adicionaremos o código com os cabeçalhos

 Clientes 
Em seguida, devemos criar o arquivo query.php para realizar a consulta SQL quando for invocado pela biblioteca.
 
O resultado da exibição no navegador deve ser o seguinte:

Anteriorpagina 1 de 2PróximoGostou e ajudou este tutorial?Você pode recompensar o autor pressionando este botão para dar a ele um ponto positivo

Você vai ajudar o desenvolvimento do site, compartilhando a página com seus amigos

wave wave wave wave wave