Forum d'entraide PHPFrance

Bonjour à tous,

J'aimerais bien avoir quelques explications sur AJAX. Je vous explique ce qui bloque dans ma pensée.

Je comprends une bonne partie du code, mais une question me turlupine. Nous spécifions que le fichier PHP qui retournera nos valeurs grâce à ses fonctions est "Query.php". Mais comment est-ce que l'on définit quelle sera la fonction appellée par ce Javascript ? Je ne suis pas sûr de tout saisir à cette partie-là, ce qui donc, entrave mon écriture de "Query.php".

[javascript]
$(document).ready( function () {
$('form.form-signin').submit( function() { // à la soumission du formulaire
event.preventDefault(); //pas recharger la page
$.ajax({ // fonction permettant de faire de l'ajax
type: "POST", // methode de transmission des données au fichier php
url: "../Universite/query.php", // url du fichier php
data: $(this).serialize(); // données sérialisées
dataType: 'json'; // type de données
success: function(msg){ // si l'appel a bien fonctionné
if(msg==1) // si la connexion en php a fonctionnée
{
alert("Connexion réussie");
}
else // si la connexion en php n'a pas fonctionnée
{
alert("Connexion échouée");
}
}
});
return false; // permet de rester sur la même page à la soumission du formulaire
});
});[/javascript]

Merci pour vos éléments de réponse.
Bonne journée.

[javascript]$(document).ready( function () {
$('form.form-signin').submit( function() { // à la soumission du formulaire
event.preventDefault(); //pas recharger la page
$.ajax({ // fonction permettant de faire de l'ajax
type: "POST", // methode de transmission des données au fichier php
url: "../Universite/query.php", // url du fichier php
data: $(this).serialize(); // données sérialisées
dataType: 'json'; // type de données
success: function(msg){ // si l'appel a bien fonctionné
if(msg==1) // si la connexion en php a fonctionnée
{
alert("Connexion réussie");
}
else // si la connexion en php n'a pas fonctionnée
{
alert("Connexion échouée");
}
}
});
return false; // permet de rester sur la même page à la soumission du formulaire
});
});[/javascript]

On ne la défini pas.

En fait, ta requête AJAX là, elle va simplement aller dans le fichier en envoyant du $_POST dedans, et après ta page Query.php fera le traitement. Ce qui signifie que si tu as écrit une fonction dedans qui fait le traitement, ça ne fonctionnera pas. Il faut que le code de traitement soit écrit directement, sans passer par une fonction.

C'est ce qu'on appelle un webservice. Rien ne t'empêche de faire une page PHP qui va include une page contenant des fonctions, et qui appelle la fonction que tu veux. Et c'est cette page que tu vas transmettre en AJAX. Mais tu dois faire une page, un webservice différent par requête AJAX.

Un exemple tout bête pour expliquer :

Webservice qui charge des résultats dans une bdd :

$oPDO = new PDO('mysql:host=localhost;dbname=db','root','password');

$sQueryNews = "SELECT * FROM `news`";

$aNews = array();

foreach ($oResultsNews = $oPDO->query($sQueryNews) as $aRow) {
    $aNews[] = $aRow;
}

echo json_encode($aNews);

Le jQuery associé :

[javascript]
$('li a[href^=index]').on('click', function () {
event.preventDefault();

var $sPage = '';
$.ajax({
url: 'webservice/newsNouveautes.php',
dataType: 'json'
})
.success(function (result) {
$sPage += '<div class="row"><div class="col-xs-12 text-center title"><h1>Nouveautés</h1></div></div>';
$sPage += '<div class="row">';
$sPage += '<div id="owl">';
$.each(result, function (key, resultSingle) {
$sPage += '<div class="item">';
$sPage += '<div class="viewSmall view-thirdSmall">';
$sPage += '<img src="' + resultSingle['image'] + '" class="img-responsive">';
$sPage += '<div class="maskSmall">';
$sPage += '<h2>' + resultSingle['titre'] + '</h2>';
$sPage += '<p>' + resultSingle['description'] + '</p>';
$sPage += '<a class="fancybox-media info" rel="group" href="' + resultSingle['lien'] + '">Visionner</a>';
$sPage += '</div>';
$sPage += '</div>';
$sPage += '</div>';
});
$sPage += '</div>';
$sPage += '</div>';
$sPage += '</div>';
});
$('#page').fadeOut('slow', function () {
$('#page').html($sPage).fadeIn('slow');
});
});
[/javascript]

Du coup ici on appelle une page PHP pour simplement avoir un traitement qu'on ne peut pas avoir autrement, et donc des informations avec lesquelles travailler. Ensuite on en fait ce qu'on veut en JS, ici je l'utilise pour générer une page.

Ah ! Ces précisions éclaircissent ma pénombre sur ce sujet.
Je te remercie, Nestecha.

Je ne vais pas include un autre fichier qui contiendrait les fonctions et les appeler. Ce n'est pas la peine dans mon application, toutefois, encore merci pour cette option d'implémentation.

Cdlt,

unnamed

J'ai encore un petit souci. J'ai donc un input à l'intérieur d'un form pour la fonction recherche (dans Search.php). Comment récupérer ce champs et l'envoyer vers le fichier qu'Ajax.js va appeler (Query.php) ?

Code Sources:

Search.php:

<?php include "include/constantes.php";?>
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<meta content="IE=edge" http-equiv="Xhtml-UA-Compatible">
	<!-- Responsive Design	-->
	<meta content="width=device-width, initial-scale=1" name="viewport">
	<meta content="" name="Page de recherche">
	<meta content="" name="Moïse Wicht">
</head>
<title>Application université</title
<!-- Application du CSS -->
<link rel="stylesheet" href="css/bootstrap.min.css" />
<link rel="stylesheet" href="css/supplement.css" />
<body>		
	<?php include "include/header.php"; ?>
	<div class="container">
		<div class="col-md-12">
			<div class="text-center">
				<form class="well form-search"  method="post">
					<input type="text" name="inputSearch" class="input-medium search-query">
					<button class="btn btn-primary" type="submit">Recherche</button>
					<?php 
						// ?
					?>
				</form>
			</div>
		</div>
	</div>
	<?php include "include/footer.php"; ?>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<script type="text/JavaScript" src="js/ajax.js"></script>
</body>
</html>

Ajax.js:
[javascript]
$(document).ready( function () {
$('form.well form-search').submit( function() { // à la soumission du formulaires
event.preventDefault(); //pas recharger la page
$.ajax({ // fonction permettant de faire de l'ajax
type: "POST", // methode de transmission des données au fichier php
url: "../Universite/query.php", // url du fichier php
data: $(this).serialize(); // données sérialisées
dataType: 'json'; // type de données
success: function(msg){ // si l'appel a bien fonctionné
if(msg==1) // si la connexion en php a fonctionnée
{
alert("Recherche réussie");
}
else // si la connexion en php n'a pas fonctionnée
{
alert("Recherche échouée");
}
}
});
return false; // permet de rester sur la même page à la soumission du formulaire
});
});[/javascript]

Query.php:

<?php include_once "class/MySQL.php";

header('Content-Type: application/json');
// Création de l'objet MySQL.
$madatabase = new MySQL();
// Connexion, récupération et sélection de la base de donnée
$link = $madatabase->connect();
$madatabase->select();
$inputSearch = // ?
// Création de la requête SQL. (a corriger)
$sql = "SELECT * 
		FROM devices_fricopy 
		WHERE marque LIKE ('%$inputSearch%') 
		OR model LIKE ('%$inputSearch%')
		OR printname LIKE ('%$inputSearch%')
		OR serialNumber LIKE ('%$inputSearch%')
		OR siufNumber LIKE ('%$inputSearch%')";
$result = mysqli_query($sql,$link) 
OR DIE (mysqli_error($link));
// Tant que qu'il y a des lignes, on affiche les données.
$donnees = array();
while ($ligne = $result->fetch_assoc()) {
	$donnees[] = $ligne;
}
echo json_encode($donnees);

?>

Je débute en PHP/Javascript et j'ai réussi à pondre déjà quelque chose de potable quasi-entièrement grâce aux aides/messages/liens trouvés sur PHPFrance. C'est pour cela que je vous remercie pour le temps consacré et un "Big Up" à tous les acteurs de ce site.

Est-ce que les valeurs contenus dans $_POST sont récupérables dans tous les fichiers PHP lors de la soumission d'un formulaire ?

J'ai trouvé une solution à mes problèmes.
Merci.