Afficher une liste de pdfs sur application web

andyandy1 Messages postés 7 Date d'inscription   Statut Membre Dernière intervention   -  
captain-coder Messages postés 8 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour à toutes et a tous, je sollicite votre aide pour résoudre un problème que j'ai , je veux afficher une liste de pdfs sur ma page web comme c'est affiché sur l'image jointe de la maquette du projet, jusqu’à maintenant j'arrive a afficher un seul pdf a l'aide de ce code : 
<table>
 <tr>
  <td><FONT color="black">  <b><big>Dossier N°1</big></b> </FONT> </td>
 </tr>
 <tr>
  <td>
   <iframe src=""quot;pdfs/Itu37276_en_certificate.pdf" width="800" height="600" align="middle"></iframe>
  </td>
 </tr>
</table>

mais pour afficher plusieurs en même temps sous forme de liste , je suis bloqué dessus , veuillez voir l'image jointe pour comprendre ce que je veux faire.
Merci d'avance
A voir également:

2 réponses

Réponse 1 / 2
captain-coder Messages postés 8 Date d'inscription   Statut Membre Dernière intervention   1
 
Bonjour, c'est très simple, il te faut créer une liste (celle à gauche sur ta maquette) qui contiendra la liste des documents PDF de cette manière par exemple: 

<ul id="pdf-list">
    <li data-toggle="chemin_du_pdf">Un document PDF</li>
    <!-- etc... -->
<li>


Ensuite il te faut donner un ID à ton ifram, dans notre cas ce sera pdf-viewer. Nous allons ensuite utiliser Jquery pour permettre le changement de l'attribut src de ton iframe: 


    $(document).ready(function(){
        $("#pdf-list>li").click(function(){
            $("#pdf-viewer").attr("src", $(this).attr("data-toggle"));
        });
    });


Voilà tu peut adapter ce code :)
1
andyandy1 Messages postés 7 Date d'inscription   Statut Membre Dernière intervention  
 
Merci beaucoup captain je vais essayer ta solution
0
captain-coder Messages postés 8 Date d'inscription   Statut Membre Dernière intervention   1
 
Aucun de problème, dit moi si ça fonctionne !
0
andyandy1 Messages postés 7 Date d'inscription   Statut Membre Dernière intervention  
 
ca n'a pas marché mais j'ai trouvé une solution qui m'affiche les pdfs en liste sauf que j'ai pas le droit de cliquer sur le pdf pour le visualiser en entier , voici le code 

<div id="bloc_page">
           <aside>
           <tr>
		<td><FONT color="black">  <b><big>PDF N°1</big></b> </FONT> </td>
	</tr>
           <iframe name=FRAME1  src=""quot;pdfs/------.pdf" width="200" height="200" align="middle"></iframe> 
           <tr>
		<td><FONT color="black">  <b><big>PDF N°2</big></b> </FONT> </td>
	</tr>
           <iframe name=FRAME1  src=""quot;pdfs/------.pdf" width="200" height="200" align="middle"></iframe> 
           <tr>
		<td><FONT color="black">  <b><big>PDF N°3</big></b> </FONT> </td>
	</tr>
           <iframe name=FRAME1  src=""quot;pdfs/--------.pdf" width="200" height="200" align="middle"></iframe>

           </aside>
           <div id="cont_all">
0
captain-coder Messages postés 8 Date d'inscription   Statut Membre Dernière intervention   1
 
Attends, je ne comprend pas bien, tu créer un iframe pour chaque document PDF ?
0
andyandy1 Messages postés 7 Date d'inscription   Statut Membre Dernière intervention   > captain-coder Messages postés 8 Date d'inscription   Statut Membre Dernière intervention  
 
c'est ce que j'ai pu faire , tout ca ca me soul je suis vraiment énervé
0
Réponse 2 / 2
dugenou Messages postés 6087 Date d'inscription   Statut Contributeur Dernière intervention   1 452
 
Bonjour,

Tu peux utiliser les fonctions PHP opendir() et readdir() pour lire le contenu du dossier qui contient tes fichiers PDF, puis, ensuite afficher le contenu : 

<?php
$rep = "nom_du_dossier";

// Creation de l'index des fichiers
$dbfiles = array();
$i = 0;
$dossier = opendir($rep);
while ($fichier = readdir($dossier)) {
  if (is_file($rep."/".$fichier)) {
    if ($fichier != "index.php") {
      $dbfiles[$i][0] = $fichier;
      $path_parts = basename($fichier);
      $path_parts = substr($path_parts,strrpos($path_parts,".")+1);
      $i++;
    }
  }
}
closedir($dossier);
@sort($dbfiles);
?>

<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">	
<title>Partage de fichiers</title>
</head>
<body>
<div style="text-align: center;">	
<h3>Fichiers disponibles</h3>
<?php
for ($i = 0; $i < count($dbfiles); $i++) {
?>
<p><a href="<?php echo $rep." rel="nofollow noopener noreferrer" target="_blank"/".$dbfiles[$i][0]; ?>" target="_blank"><?php echo $dbfiles[$i][0]; ?></a></p>
<?php
}
?>
</div>
</body>
</html>


Il faut remplacer (ligne 2) nom_du_dossier par le nom du dossier qui contient les fichiers PDF et retirer rel="nofollow noopener noreferrer" (ligne 34), que CCM met systématiquement.

Le fichier qui contiendra ce code, doit avoir une extension php

0
captain-coder Messages postés 8 Date d'inscription   Statut Membre Dernière intervention   1
 
Bonjour, je pense que le but est d'effectuer l'opération sans que la page charge à nouveau.
0
andyandy1 Messages postés 7 Date d'inscription   Statut Membre Dernière intervention  
 
Merci pour ta réponse , mais je ne travail pas avec php , je suis sur JAVA, eclipse
0
captain-coder Messages postés 8 Date d'inscription   Statut Membre Dernière intervention   1
 
Mon code marche très bien:

index.html: 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>test</title>
</head>
<body>

<ul id="pdf-list">
    <li datatype="1.pdf">Document 1</li>
    <li datatype="2.pdf">Document 2</li>
</ul>

<br><br>

<iframe id="pdf-viewer" src=""quot;1.pdf"></iframe>

<script src=""quot;https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.[/contents/577-javascript-introduction-au-langage-javascript js]"></script>
<script src=""quot;test.js"></script>
</body>
</html>


test.js: 

$(document).ready(function(){
    $("#pdf-list li").click(function(){
        $("#pdf-viewer").attr("src", $(this).attr("datatype"));
    });
});




Ce code la fonctionne très bien tu as juste à le mettre en forme ^^
0