Jump to content
Sign in to follow this  
Alastor

[Débutant] PHP/AJAX, je galère !

Recommended Posts

Bonjour amis développeurs,

je suis sur un problème depuis hier soir que je n'arrive pas à résoudre, du fait de mon noobisme en AJAX.

J'ai une classe PHP (son joli nom : class_datametrieCollection.php) dans laquelle j'ai implémenté une fonction de filtres (Filter() oui je me suis pas foulé pour le nom), pour ne retourner que les objets correspondant au filtre passé en paramètre (bon en même temps, c'est un peu le but d'un filtre, hein ? icon_mrgreen.gif) => ça, ça marche (youpi).

J'ai une seconde classe PHP (son joli nom : class_datametrieInterface.php) qui me sert d'interface avec tous les objets et qui permet leur affichage via une méthode CreateView(). Cette méthode contient entre autre choses toute la partie HTML dont un champ de saisie (id : nomMoniteur) qui permettra d'entrer le filtre, un champ de sélection (id : statutMoniteur) pour un second filtre et un tableau, qui sera la "variable" que je voudrais travailler via AJAX (id : data_values).

Ce que j'aimerais faire :
J'aimerais "tout simplement" que lorsque je tape une lettre dans mon champ de saisie, ou que je sélectionne une option dans mon champ de sélection, faire appel dynamiquement à ma fonction PHP de filtre et mettre à jour le tableau. J'imagine qu'il faut que je passe de toute façon par une requête GET ou POST (je préférerais POST) ?
J'ai bien compris qu'il fallait que j'implémente côté AJAX quelque chose du style :

$(document).ready(function() {
   // saisie dans le champ nomMoniteur
   $('#nomMoniteur').keyup(function() {
       ...
   };
 
   // changement de statut dans la sélection
   $('#statutMoniteur').change(function() {
       ...
   };
};

J'ai bon ? Par contre, j'ai du mal à comprendre comment faire fonctionner les $.post() et toutes ces joyeusetés... Donc si quelqu'un peut me filer un coup de main, ce serait vivement apprécié icon_wink.gif

Share this post


Link to post
Share on other sites

AJAX ça ne veut rien dire :chinois:

 

Pour le reste oui c'est quelque chose du genre. Tu déclares un évènement à l'intérieur duquel tu vas faire un appel serveur, et tu traiteras la réponse du serveur en JS.

genre :

jQuery.ajax({

url:'mon_url',

param1: value,

param2: value

onComplete:function(result){

// traitement réponse ici

}

})

Share this post


Link to post
Share on other sites

Merci de ta réponse :10_wink:

J'ai fait un truc comme ça :

$(document).ready(function() {
	
	// sur saisie dans le champ nomMoniteur
	$('#nomMoniteur').keyup(function() {
		// on récupère le contenu du champ nomMoniteur
		var nomMoniteur = $('#nomMoniteur').val();
		// si le champ est vide
		if (nomMoniteur.length == 0) {
			// A faire
		}
		// si le champ n'est pas vide (filtre en cours)
		else {
			// on masque le tableau le temps du traitement
			$('#data_values').hide();
			$.post(
				'class_datametrie.php',
				nomMoniteur,
				'function_retour',
				'html'
			);
			
			function function_retour(data) {
				// Traitement ?
			}
		}
	});
});

Par contre, je comprends pas trop ce que je dois mettre dans la fonction function_retour(data) ?

Share this post


Link to post
Share on other sites

Je te déconseille fortement l'usage des paramètres de la fonction post comme ça : c'est illisible au possible et ça te limite considérablement. Passe plutôt un objet.

Et dans ta fonction retour, ton code php va renvoyer une string (echo "mon html que je veux insérer"), string que tu auras dans data. Il ne te reste plus qu'à faire quelque chose du genre $('monElementDontJeVeuxRemplacerLeContenu').html(data)

Share this post


Link to post
Share on other sites
3 hours ago, tigerskin said:

Merci de ta réponse :10_wink:

J'ai fait un truc comme ça :


$(document).ready(function() {
	
	// sur saisie dans le champ nomMoniteur
	$('#nomMoniteur').keyup(function() {
		// on récupère le contenu du champ nomMoniteur
		var nomMoniteur = $('#nomMoniteur').val();
		// si le champ est vide
		if (nomMoniteur.length == 0) {
			// A faire
		}
		// si le champ n'est pas vide (filtre en cours)
		else {
			// on masque le tableau le temps du traitement
			$('#data_values').hide();
			$.post(
				'class_datametrie.php',
				nomMoniteur,
				'function_retour',
				'html'
			);
			
			function function_retour(data) {
				// Traitement ?
			}
		}
	});
});

Par contre, je comprends pas trop ce que je dois mettre dans la fonction function_retour(data) ?

C'est le traitement que tu veux faire après que t'as fonction côté php s'est executée....

tu as la méthode ajax en Jquery pour faire des appels en ajax, et que je trouve plus simple 

http://api.jquery.com/jquery.ajax/

 

 

 

Share this post


Link to post
Share on other sites
Le 03/03/2017 à 20:20, Cara62 a dit :

C'est le traitement que tu veux faire après que t'as fonction côté php s'est executée....

tu as la méthode ajax en Jquery pour faire des appels en ajax, et que je trouve plus simple 

http://api.jquery.com/jquery.ajax/

 

C'est strictement la même chose à une différence près : en utilisant post() tu n'as pas besoin de passer "method:'post'" en paramètre pour avoir du post (et tu peux passer des paramètres pré-déterminés alors que ajax prend uniquement un objet en paramètre).

 

Pour l'OP : sinon tu as jQuery(myElement).load() en plus simple qui va directement remplacer le contenu de myElement par la réponse du serveur

Edited by Fuinril

Share this post


Link to post
Share on other sites

Merci à vous 2 pour les réponses.

Bon finalement, j'ai fait beaucoup plus simple et j'ai codé une petite fonction en JS qui masque/affiche les lignes de mon tableau en fonction de ce que tape l'utilisateur dans le champ de saisie, via le innerHTML. Ca fonctionne bien et ça m'évite d'avoir à passer par une fonction PHP supplémentaire pour filtrer le tableau.

Je passe le sujet en résolu :) (Edit : pas trouvé comment on fait :( )

Edited by tigerskin

Share this post


Link to post
Share on other sites
On 06/03/2017 at 3:18 PM, Fuinril said:

C'est strictement la même chose à une différence près : en utilisant post() tu n'as pas besoin de passer "method:'post'" en paramètre pour avoir du post (et tu peux passer des paramètres pré-déterminés alors que ajax prend uniquement un objet en paramètre).

 

Pour l'OP : sinon tu as jQuery(myElement).load() en plus simple qui va directement remplacer le contenu de myElement par la réponse du serveur

Exact mea culpa, trop l'habitude d'utiliser uniquement $.ajax :transpi:

 

On 07/03/2017 at 10:37 AM, tigerskin said:

Merci à vous 2 pour les réponses.

Bon finalement, j'ai fait beaucoup plus simple et j'ai codé une petite fonction en JS qui masque/affiche les lignes de mon tableau en fonction de ce que tape l'utilisateur dans le champ de saisie, via le innerHTML. Ca fonctionne bien et ça m'évite d'avoir à passer par une fonction PHP supplémentaire pour filtrer le tableau.

Je passe le sujet en résolu :) (Edit : pas trouvé comment on fait :( )

Non on peut plus passer les sujets en "résolu" :( 

 

Sinon, je viens de tilter, à la base c'est juste pour faire du trie et de la recherche avec un tableau ? Je te conseille fortement datatables c'est très puissant et paramétrable...

il récupère le tableau automatiquement et le transforme à sa sauce avec champs de recherche +pagination. :)

et en prime tu peux même utiliser l'ajax pour récupérer les données du tableau. :yes:   

Share this post


Link to post
Share on other sites

Le passage a résolu est remplacé par "la meilleur" réponse que tu peux désigner en cliquant sur la coche dans la marge gauche du dit message.

Share this post


Link to post
Share on other sites

Please sign in to comment

You will be able to leave a comment after signing in



Sign In Now
Sign in to follow this  

×
×
  • Create New...