Get Demo Code

Web App Developer!

This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.


It uses utility classes for typography and spacing to space content out within the larger container.

Datatables Jquery Plugin with Bootstrap Php and MySql


Step: 1

Create Database with name getdemocode then create table with name datatable_demo having columns Name,Address,Gender,Designation,Age

Step: 2

Insert Some values:

INSERT INTO `datatable_demo`(`id`, `name`, `address`, `gender`, `designation`, `age`)
                  VALUES (1,'san','Mumbai','M','Web Dev',21),
                         (2,'ban','Pune','M','Web Design',23),
                         (3,'dan','Banglore','M','Web Dev',25),
                         (4,'saan','Trichy','M','Graphic Design',27),
                         (5,'sasdn','Pune','F','Web Dev',31),
                         (6,'sand','Mumbai','M','Web Design',21),
                         (7,'sane','Pune','M','Web Dev',51),
                         (8,'sans','Banglore','M','Graphic Design',43),
                         (9,'asan','Mumbai','M','Web Dev',31),
                         (10,'adsan','Pune','F','Web Design',42),
                         (11,'gdsan','Mumbai','M','Graphic Design',36),
                         (12,'rsan','Banglore','M','Web Dev',24),
                         (13,'dsan','Mumbai','M','Web Design',22),
                         (14,'nsan','Pune','M','Web Dev',26),
                         (15,'fssan','Mumbai','F','Graphic Design',21),
                         (16,'wsan','Banglore','M','Web Design',28),
                         (17,'qsan','Mumbai','M','Web Dev',30)

Step: 3
<?php  
 $connect = mysqli_connect("localhost", "root", "", "getdemocode");  
 $query ="SELECT * FROM datatable_demo ORDER BY id DESC";  
 $result = mysqli_query($connect, $query);  
 ?>  
<!DOCTYPE html>
<html lang="en">

 <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
 <head>  
  <title>Datatables Jquery Plugin with Bootstrap Php and MySql  </title>  
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js">
  </script>  
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/
  3.3.6/css/bootstrap.min.css" />  
  <script src="https://cdn.datatables.net/1.10.12/js/
  jquery.dataTables.min.js"></script>  
  <script src="https://cdn.datatables.net/1.10.12/js/
  dataTables.bootstrap.min.js"></script>            
  <link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/
  dataTables.bootstrap.min.css" />  
  </head>  
  <body>  
    <div class="container">  
     <h3 align="center">Datatables Jquery Plugin with Php MySql and Bootstrap</h3>  
           <br />  
                <div class="table-responsive">  
                 <table id="employee_data" class="table table-striped table-bordered">  
                          <thead>  
                               <tr>  
                                    <td>Name</td>  
                                    <td>Address</td>  
                                    <td>Gender</td>  
                                    <td>Designation</td>  
                                    <td>Age</td>  
                               </tr>  
                          </thead>  
                          <?php  
                          while($row = mysqli_fetch_array($result))  
                          {  
                               echo '  
                               <tr>  
                                    <td>'.$row["name"].'</td>  
                                    <td>'.$row["address"].'</td>  
                                    <td>'.$row["gender"].'</td>  
                                    <td>'.$row["designation"].'</td>  
                                    <td>'.$row["age"].'</td>  
                               </tr>  
                               ';  
                          }  
                          ?>  
                     </table>  
                </div>  
           </div>
           
               
      </body>  
 </html>  
 <script>  
 $(document).ready(function(){ 
   
      $('#employee_data').DataTable({ "pagingType": "full_numbers"
                                    
                                    });  
 });  
 </script>        
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nesciunt hic enim veniam vel, doloribus dicta, et natus. Eveniet eum velit nobis, ex reprehenderit aliquid sunt aperiam, ratione libero rerum, iure? Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora aspernatur recusandae quos dolores sint, alias minima deleniti ipsum ad ullam porro necessitatibus repellat consectetur corrupti sed reiciendis facere totam officia quae libero sunt. Quibusdam distinctio sed, aliquid voluptatibus aspernatur doloribus.
Card image cap
Future

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Last updated 3 mins ago

Card image cap
Infinite Loop

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem.

Last updated 3 mins ago

Card image cap
Mediation

Nor again is there anyone who loves or pursues or desires to obtain pain of itself, because it is pain, but because occasionally circumstances occur in which toil and pain can procure him some great pleasure. To take a trivial example, which of us ever undertakes laborious physical exercise, except to obtain some advantage from it? But who has any right to find fault with a man who chooses to enjoy a pleasure that has no annoying consequences, or one who avoids a pain that produces no resultant pleasure?"

Last updated 3 mins ago