Bonjour
voila j'ai suivis ce tutoriel ici pour créer une liste d'utilisateur avec ma bdd.
seulement j'aimerai y ajouter une fonctions ou un pluguins de datatables.net.
je voudrais ajouter le plugin row details pour pouvoir ajouter d'autre détails.
je ne suis pas un expert je débute un peut.
j'ai regardé mais je ne sais pas comment ça fonctionne et ce que je dois ajouter

Si il y a une personne pour m'aider.

voici ma page html

<div class="w3-content w3-container w3-padding-64" id="about">
    <h3 class="w3-center"></h3>

      <div class="">
          <div class="">
            <!-- Blog entry -->
            <div class="w3-card-4 w3-margin w3-white">
              <div class="bgimg-4 w3-display-container w3-opacity-min" id="home" style="    margin: 0px 10%;">
                <div class="mtag">GAMING LIVE</div>
                <div class="w3-display-middle" style="white-space:nowrap;">
                  <span class="w3-center w3-padding-large w3-black w3-xlarge w3-wide w3-animate-opacity"> <span class="w3-hide-small">REJOINS NOUS !!!</span> </span>
                </div>
              </div>

              <div class="w3-container" style="    margin: 0px 10%">
                <div class="table-responsive" style="    min-height: 700px;">
                      <table id="product_data" class="">
                         <thead>
                            <tr> 
                                 <th><i class="far fa-calendar-alt"></i></th>
                                 <th><i class="far fa-user"></i></th>
                                 <th><i class="far fa-gamepad"></i>
                                    <select name="category" id="category" class="form-control">
                                       <option value="">Touts les Jeux</option>
                                       {$envoie} <!-- reçoit la boucle php  -->
                                    </select>
                                 </th>
                                 <th>Steam Statut</th>
                                 <th>Age</th>
                            </tr>
                         </thead>
                      </table>
                   </div>
              </div>
            </div>

          </div>
    </div>

</div>

</body>

{$ad}

<script type="text/javascript" language="javascript" >
$(document).ready(function(){

 load_data();

 function load_data(is_category)
 {
  var dataTable = $('#product_data').DataTable({
   "processing":true,
   "serverSide":true,
   "order":[],
   "ajax":{
    url:"includes/fetch.php",
    type:"POST",
    data:{is_category:is_category}
   },
   "columnDefs":[
    {
     "targets":[2],
     "orderable":false,
    },
   ],
   "language": {
     "processing": "<div id='loader'></div>"
  }
  });
 }

 $(document).on('change', '#category', function(){
  var category = $(this).val();
  $('#product_data').DataTable().destroy();
  if(category != '')
  {
   load_data(category);
  }
  else
  {
   load_data();
  }
 });
});
</script>

et voici ma page fetch.php qui va chercher mes resulats du tableau :

<?php
//fetch.php

$connect = mysqli_connect("localhost", "root", "", "sgamer");

$column = array("uc.date_add", "u.username", "c.category_g_name", "uc.recherche", "u.born");
$query = "
 SELECT * FROM users U
 INNER JOIN users_category UC ON (U.idu = UC.id_users)
 INNER JOIN category_games C ON (UC.id_category = C.id) 
";
$query .= " WHERE";
$query .= " UC.recherche = 1 AND";
if(isset($_POST["is_category"]))
{
 $query .= " c.id = '".$_POST["is_category"]."' AND ";
}
if(isset($_POST["search"]["value"]))
{
 $query .= '(uc.date_add LIKE "%'.$_POST["search"]["value"].'%" ';
 $query .= 'OR u.username LIKE "%'.$_POST["search"]["value"].'%" ';
 $query .= 'OR c.category_g_name LIKE "%'.$_POST["search"]["value"].'%" ';
 $query .= 'OR uc.recherche LIKE "%'.$_POST["search"]["value"].'%" ';
 $query .= 'OR u.born LIKE "%'.$_POST["search"]["value"].'%") ';
}

if(isset($_POST["order"]))
{
 $query .= 'ORDER BY '.$column[$_POST['order']['0']['column']].' '.$_POST['order']['0']['dir'].' ';
}
else
{
 $query .= 'ORDER BY uc.date_add DESC ';
}

$query1 = '';

if($_POST["length"] != 1)
{
 $query1 .= 'LIMIT ' . $_POST['start'] . ', ' . $_POST['length'];
}

$number_filter_row = mysqli_num_rows(mysqli_query($connect, $query));

$result = mysqli_query($connect, $query . $query1);

$data = array();

while($row = mysqli_fetch_array($result))
{  

    // calcule age user
    $ub = explode('-', $row["born"]) ;
    $age = date('Y') - $ub[0] ;
    if ( date('md') < $ub[1].$ub[2] ) $age-- ;

    //calcul nbr de our de l'annonce
    $now = new DateTime("now");
    $dateBdd = new DateTime($row["date_add"]);
    //$date_add = $dateBdd1->diff($now)->format("%d jours, %h heurs and %i minutes");
    $date_add = $dateBdd->diff($now);
    $jours = $date_add->format("%d jrs");
    $heurs = $date_add->format("%h hrs");
    $minute = $date_add->format("%i min");
    if ($jours == 0 ) { 

        if ($heurs == 0 ) {
            $afficher = $minute;
        }
        else {
            $afficher = $heurs;
        }
    }  else {
            $afficher = $jours;
    }

    $URL = 'http://localhost';
$gamesr = explode(',', $row["category_g_name"]);
 $sub_array = array();
 $sub_array[] = "";
 $sub_array[] = $afficher;
 $sub_array[] = '<a href="'.$URL.'/index.php?a=profile&u='.$row["username"].'">'.$row["username"].' </a>';
 $sub_array[] = $row["category_g_name"];
 $sub_array[] = $row["steam"];
 $sub_array[] =  $age. 'ans  <a href="'.$URL.'/index.php?a=profile&u='.$row["username"].'" class="voir">+</a>';
 $data[] = $sub_array;

}

function get_all_data($connect)
{

 $query = "SELECT * FROM users_category";
 $result = mysqli_query($connect, $query);
 return mysqli_num_rows($result);
}

$output = array(
 "draw"    => intval($_POST["draw"]),
 "recordsTotal"  =>  get_all_data($connect),
 "recordsFiltered" => $number_filter_row,
 "data"    => $data
);

echo json_encode($output);

?>

2 réponses


Pour utiliser le plugin DataTables il faut le télécharger et l'installer sur ton serveur... Ensuite, t'as tout le code (php, css, js) au lien que tu as fourni :-s

oui ca j'y etait arrivé.

mais c'est on en cherchant un peut j'y suis arrivé merci