Récupération et affichage de photo de profil candidat ajax php

Fermé
Patrick.Bunga Messages postés 15 Date d'inscription jeudi 21 août 2014 Statut Membre Dernière intervention 4 septembre 2014 - 3 sept. 2014 à 18:30
Patrick.Bunga Messages postés 15 Date d'inscription jeudi 21 août 2014 Statut Membre Dernière intervention 4 septembre 2014 - 4 sept. 2014 à 09:34
Bonjour worlds!

je créer une petite application web. dans cette application je dois avoir une page de recherche d'élément dans la bdd le mécanisme se fait par un formulaire de recherche qui récupère les éléments de la bdd via ajax, php et mysql. pour les afficher sur la la même page. les éléments à récupérés sont l'Identité d'un élève. qui sont: nom, prénom et la photo..

ça marche un peu, quand je saisis le code d'un élève sur le form de recherche, il m'affiche seulement le nom, prénom mais pas la photo. au contraire il doit m'afficher normalement aussi avec la photo de l'élève.

mon problème est, comment aller récupérer la photo logée dans son répertoire qui est renommé ( upload_photo) en relation avec son chemain_photo et le nom_photo qui sont dans la bdd.
pour les afficher ensemble avec d'autres éléments via ajax ? Veuillez m'aider je vous supplie.

voici mon code. coté client.

cette page je l'appel: recherche.php


<?php echo '<?xml version="1.0" encoding="iso-8859-15"?>'; ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>AJAX : Exemple de client</title>
<script>
var http; // Notre objet XMLHttpRequest

function createRequestObject()
{
var http;
if(window.XMLHttpRequest)
{ // Mozilla, Safari, ...
http = new XMLHttpRequest();
}
else if(window.ActiveXObject)
{ // Internet Explorer
http = new ActiveXObject("Microsoft.XMLHTTP");
}
return http;
}

function gestionClic()
{
document.getElementById("textProgess").innerHTML= 'Recherche en cours, attendre svp...';
http = createRequestObject();
var code_eleve = encodeURIComponent(document.getElementById("code_eleve").value);

http.open("GET", "traitement.php?code_eleve=" + code_eleve, true);
http.onreadystatechange = handleAJAXReturn;
http.send(null);
}


function handleAJAXReturn()
{
if(http.readyState == 4 && http.status == 200)
{


var tmp = http.responseText.split("/");
if(tmp[0] ==100)
{


document.getElementById("nom_eleve").innerHTML=tmp[1];
document.getElementById("postnom_eleve").innerHTML=tmp[2];
document.getElementById("prenom_eleve").innerHTML=tmp[3];
document.getElementById("code_classe").innerHTML=tmp[4];
document.getElementById("lib_option").innerHTML=tmp[5];
document.getElementById("tuteur_nom").innerHTML=tmp[6];
document.getElementById("ad_physik_eleve").innerHTML=tmp[7];
document.getElementById("email_eleve").innerHTML=tmp[8];
document.getElementById("tel_eleve").innerHTML=tmp[9];
document.getElementById("date_enregi_eleve").innerHTML=tmp[10];
document.getElementById("date_naiss_eleve").innerHTML=tmp[11];
document.getElementById("lieu_naiss_eleve").innerHTML=tmp[12];
/*document.getElementById("nom_photo").innerHTML=tmp[13];*/
document.getElementById("cache_table").style.display="block";

document.getElementById("textProgess").innerHTML="";


alert("Recherche trouve.");
return true;

}

else if(tmp[0] ==101)
{

alert("Attention! Recherche non conluant.");
return false;

}
}
else if(http.readyState == 4 && http.status != 200)
{
// En cas d'erreur !
alert("Attention, une erreur soit, de coupure réseau ou, de données invalides est survenue lors du chargement.");
}
}



</script>
<style>
.table_rch{
width:100%; height:100%; display:none; font-size: 13px;

}
.table_rch th {

background:#999;
text-align:left;
}
.table_rch td{
background:#CCC;
border:1px solid #333;
}
</style>
</head>
<body>
<p>
<form>
<input type="text" name="code_eleve" id="code_eleve" value="" />
<input type="button" onclick="gestionClic(); return false;" value="Chercher" />
</form>

<div id="textProgess"></div>
<br /><br />
<div ></div>
<div ></div>


<table border="0" id="cache_table" class="table_rch">

<tr>
<th> Nom</th><td id="nom_eleve"> </td><th> Poste nom</th><td id="postnom_eleve"> </td> <th> Prénom</th><td id="prenom_eleve"> </td><td rowspan="4">
<img src='uploads_photo/$nom_photo' id='nom_photo' width="150"></td>
</tr>
<tr>
<th> Classe</th><td id="code_classe"> </td> <th> Option</th><td id="lib_option"> </td> <th> Tuteur</th><td id="tuteur_nom"> </td>
</tr>
<tr>
<th> Adresse </th><td id="ad_physik_eleve"> </td> <th> Email</th><td id="email_eleve"> </td> <th> Phone</th><td id="tel_eleve"> </td>
</tr>
<tr>
<th> Date d'enregitrement</th> <td id="date_enregi_eleve"></td> <th> Date de naissance</th><td id="date_naiss_eleve"> </td> <th>Lieu de naissance</th><td id="lieu_naiss_eleve"> </td>
</tr>

</table>

</p>
</body>
</html>





En suite du coté serveur. c'est la page traitement.php





<?php
sleep(1);
/* $code_eleve = (isset($_GET["code_eleve"])) ? $_GET["code_eleve"] : NULL;
*/
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");


$code_eleve =(isset($_GET["code_eleve"])) ? $_GET["code_eleve"] : NULL;
mysql_connect("localhost","root","");
mysql_select_db("fraiscolaire");

$eq=mysql_query("SELECT * FROM eleve WHERE code_eleve='$code_eleve'");
if($rep=mysql_fetch_array($eq))
{
$nom_eleve=$rep['nom_eleve'];
$postnom_eleve=$rep['postnom_eleve'];
$prenom_eleve=$rep['prenom_eleve'];
$code_classe=$rep['code_classe'];
$lib_option=$rep['lib_option'];
$tuteur_nom=$rep['tuteur_nom'];
$ad_physik_eleve=$rep['ad_physik_eleve'];
$email_eleve=$rep['email_eleve'];
$tel_eleve=$rep['tel_eleve'];
$date_enregi_eleve=$rep['date_enregi_eleve'];
$date_naiss_eleve=$rep['date_naiss_eleve'];
$lieu_naiss_eleve=$rep['lieu_naiss_eleve'];
$nom_photo=$rep['nom_photo'];

$affichage=100;
echo $affichage.'/'.$nom_eleve.'/'.$postnom_eleve.'/'.$prenom_eleve.'/'.$code_classe.'/'.$lib_option.'/'.$tuteur_nom.'/'.$ad_physik_eleve.'/'.$email_eleve.'/'.$tel_eleve.'/'.$date_enregi_eleve.'/'.$date_naiss_eleve.'/'.$lieu_naiss_eleve.'/'.$nom_photo;
}
else
{
# Recherche non conluant.
$affichage=101;
echo $affichage;
}

?>

A vous !
A voir également:

2 réponses

Salut, avant le code c'est la conception qui compte.

La base de votre application web c'est de faire le tri de vos données et d'organiser en entités logiques(Modèle conceptuel de données MCD).
Une fois obtenu un MCD cohérent et en rapport avec les informations à traiter vous obtenez vos tables de données(Modèle Logique de Données).

Dans votre cas il semble qu'il y ait des jointures de table, ce n'est donc pas un problème de code.
Si dans votre conception vous avez des tables liées(par le biais de clés étrangères qui sont des identifiants permettant de joindre les tables en plus de l'id naturel (ou numérique auto-incrémenté si vous en ajoutez un)) il vous faut donc comparer dans une des tables jointes les points communs pour trouver les données qui répondent à votre besoin.

Donc si vous avez l'identifiant(naturel ou numérique selon votre choix) de la table élève vous pouvez utiliser celui ci pour avoir les informations complémentaire car c'est ID de l'élève est la clé étrangère dans votre autre table contenant les données à 'croiser'.


Je vous incite à faire quelques exercices de ce langage simple, basique, rapide et limité(on parle de langage de bas niveau) qu'est SQL

http://sql.sh/ (ici par exemple)

qui comme son nom l'indique est LE LANGAGE DES REQUÊTES Auprès DE LA BASE DE Données.
Si le langage est simple il faut toutefois que votre conception(les tables) soient claire et compréhensible pour vous, ainsi que les liaisons entre ces entités logiques(jointure de table par le biais des clés étrangères FK en anglais pour foreign key).
0
Patrick.Bunga Messages postés 15 Date d'inscription jeudi 21 août 2014 Statut Membre Dernière intervention 4 septembre 2014
4 sept. 2014 à 09:34
Slt. mon problème n'est pas celui là. comme il est expliqué ci-haut. toute les informations à récupérer se trouvent dans la même table. eleve. ajax communique bien avec PHP via sql pour récupérer les informations de l'élève logées dans la bdd. Pour mieux expliquer, j'ai une bdd sous mysql que j'appel "fraiscolaire" et dans cette bdd il y a la table "eleve" c'est dans cette table où j'ai dans champs comme: nom_eleve, postnom_eleve, nom_photo, chemin_photo,taille_photo, prenom_eleve ainsi de suite... et dans le repertoire de mon projet j'ai un dossier que j'ai renommé "upload_photo". Via un formulaire d'enregistrement j'enregistre bien les élèves. Les nom_eleve, postnom_eleve, nom_photo, chemin_photo,taille_photo, prenom_eleve. s'enregistre très bien dans la table eleve. et les photos suivent le chemin orienté pour se loger dans le dossier upload_photo. maintenant pour afficher, la 1e méthode rien que avec php mysql ça marche. via un petit formulaire de recherche je tape soit le nom de l'élève, il m'affiche toutes ses informations avec sa photo. vous et moi nous savons bien que avec cette façon, dans le formulaire avec le submit. il va chercher à recharger la page. c'est ce que j'évite. je voudrais faire un peu de chose de la manière professionnelle avec ajax sans pourtant recharger la page qu'il puisse récupérer ces informations et les afficher avec la photo. mais dans ce que j'ai fais avec ajax ci-haut, il récupère tout sauf la photo. là je suite vraiment bloquer. je pense que c'est claire à comprendre maintenant!
0