Pagination dans un code "jquery Instant-search"

**booraq** · 14/12/2016, 19h47

Bonjour à tous ;-)

Voilà, je voudrais faire un moteur de recherche avec un système d' autosuggest.
j'ai glané sur le web un script qui s'en rapproche, il fait fonctionne bien,
je peux aussi le faire fonctionner comme un moteur normal avec pagination des résultats,
mais c'est justement là que ça bloque (la pagination):
mes numéros de page s'affichent mais en cas de click dessus, ça ne va nulle part (page vide!)
alors quelqu'un peut-il m'aider.
NB: je suis loin d'être un as de l'ajax et du jquery, par contre je touche un peut au php et mysql.
merci.

je vous présente le chef-d'oeuvre:
index.php (comprend une petite pagination qui affiche les pages mais ne fonctionne pas)

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
<html xmlns="http://www.w3.org/1999/xhtml">
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title> 
<link rel="stylesheet" href="style.css" type="text/css">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="ajax.js"></script>
</head>
<body>
<div id="content">
<?php
$query=@mysql_connect("localhost","root",""); 
@mysql_select_db("booraqdb",$query);  
 
$val='';
if(isset($_POST['submit'])){
   if(!empty($_POST['name'])){//if2
      $val=$_POST['name'];
   }
else{
     $val='';
   }
}//if2
?>
<center><img src="freeze.PNG"></center>
<form method="post" action="index.php">Search : <input type="text" name="name" id="name" autocomplete="off" value="<?php echo $val;?>">
<input type="submit" name="submit" id="submit" value="Search">
</form>
 
<div id="display"></div>
<?php
if(isset($_POST['submit'])){//if1
if(!empty($_POST['name'])){//if2
   $name=$_POST['name'];
   //----------------------------------------------------------------------
   //nbArt est le nombre total de réponse
  $sql="SELECT COUNT(*) FROM moteur WHERE nom LIKE '%".$name."%'";
  $req=@mysql_query ($sql)or die (mysql_error());
  $data=@mysql_fetch_array($req);
  
  if($data[0]!=0) $nbArt=$data[0];
else {echo "pas de résultats";
exit();
}
  
  $perPage=6;//nombre de résultats par page
  $nbPage=ceil($nbArt/$perPage);//nombre de page -arrondir à la valeur supérieure.    
  
  //vérifier si la variable 'page' existe !
  //cPage est la page courante ou page de début
    if(isset($_GET['page'])&& $_GET['page'] > 0 && $_GET['page'] <= $nbPage){
  $cPage=$_GET['page'];
  }
  else {
        $cPage=1;//page de début
  }
  
  $start=($cPage-1)*$perPage;//exemple cPage=168, perPage=6 alors on affiche les résultats: 1772....1777
  $sql="SELECT * FROM moteur WHERE nom LIKE '%".$name."%' ORDER BY id ASC LIMIT ".$start.",$perPage";//défini une plage de réponses
  $req=@mysql_query($sql)or die(mysql_error());
  
  while($data=@mysql_fetch_array($req)){
  echo "<B>".$data['id']."</B>&nbsp;";
  echo $data['nom']."<br>";  
  echo $data['adresse']."<br>";
  echo  "<hr>";
  } 
  
  //PAGINATION
  
  for($i=1;$i<=$nbPage;$i++){
        if($i==$cPage){//cPage est la page actuelle
                echo " $i /";//lien inactif
        }//if
        else{
                echo " <a href=\"index.php?nom=".$name."&page=".$i."\">".$i."</a> / " ;
                
        //c'est un lien actif
  }//else
  }//for
    
}//if2
else{
     echo "No Results";
}
}//if1
?>
</div>
</body>
</html>

ajax.php (traite l'autosuggest) il fonctionne bien

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<?php
$query=@mysql_connect("localhost","root","");
@mysql_select_db("booraqdb",$query);
 
if(isset($_POST['name'])){	
   $name=trim($_POST['name']);
   $query2=@mysql_query("SELECT * FROM moteur WHERE nom LIKE '%$name%' ORDER BY id ASC limit 0,6 ");//c'est l'autosuggest
 
   echo "<ul>";
   while($data=@mysql_fetch_array($query2)){
?>
<li onclick='fill("<?php echo $data['nom']; ?>")'><?php echo $data['nom']; ?></li>
<?php
   }//while
}//if
?>
</ul>

ajax.js (code jquery pour l''auto-suggest, fonctionne bien)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
function fill(Value){
     $('#name').val(Value);
     $('#display').hide();
}
 
$(document).ready(function(){
    $("#name").keyup(function(){
    var name = $('#name').val();
    if(name==""){
       $("#display").html("");
    }
    else{
         $.ajax({
         type: "POST",
         url: "ajax.php",
         data: "name="+ name ,
         success: function(html){
             $("#display").html(html).show();
             }
         });
     }
});
});