Requête Ajax sur menu déroulant

Bonjour,

C'est la première fois que j'utilise un forum pour soumettre un problème que je vous expose tout de suite.
Je précise que j'ai préalablement fait des recherches sur le web mais les informations trouvées ne m'ont pas permises de solutionner mon problème. J'en appelle donc à des personnes plus expertes que moi .

Dans le cadre d'un projet d'étude je dois réaliser un petit back office lié à un site qui référence des formations et des écoles.
Les formations et écoles sont répertoriées dans des tables d'une base de données MySQL.

Dans la page d'accueil du Back Office que j'ai nommée accueil.php j'ai un menu déroulant avec les départements.
Mon but est de faire en sorte qu'en sélectionnant un département, un appel Ajax me permette d'afficher le nombre d'écoles et le nombre de formations qui existent dans ma base de données pour le département en question.

Pour ce faire j'ai déclaré une bibliothèque jQuery dans ma balise head et j'ai ajouté un id="departements" dans la balise <select> de mon menu déroulant.
J'ai également déclaré une balise script en fin page qui appelle un fichier fonction.js

La balise script se présente comme suit:

<script src="js/fonction.js"></script>

et fonction.js:

$(document).ready(function() {
                $('select#departements').change(function() {
		//récupèration du departement
		var value = $(this).val();
                //Index
                var i = 0;
		//Appel Ajax
		$.ajax({
                //Indication du fichier où aller consulter 
		url: "../traitements.php",
                //Type de l'envoi (POST ou GET)
		type: "POST",
                //Le résultat sera un tableau JSON      
		dataType: "JSON",
		//On lui donne le departement
                data: {departement : value},
		success:function(data)
		{
                        //Nécessite d'avoir les informations du tableau dans le 
                        //même ordre que les champs où injecter l'information
                        $('td.ajax').each(function(){
		                 $(this).val(data)
				  i++;
			});
		}
	});

});
});

Ce script fait appel à un fichier traitements.php qui est stocké à la racine de mon Back et dont voici le contenu:

<?php
	//On récupère le nom passé en paramètre
	$department = $_POST['departement'];

	//Requête
	require_once('includes/connexion.inc.php');
	
	$queryF = "SELECT COUNT(*) FROM formations WHERE departement = $department AND actif = 'o'";
	
	$resultF =  $connect->query($queryF)
	or die('Erreur de la requete ligne '.__LINE__.'<br>
	avec la requete:'.$queryF.'</br>
	et le message: '.mysqli_error($connect)
	);
	
	echo json_encode($resultF);

?>

Je souhaite faire apparaitre le nombre de formations répertoriées dans ma table formations dans la partie suivante située après le menu déroulant de ma page accueil.php:

<table>
<tr><td>Formations:</td><td class="ajax"></td></tr>
</table>

Le code actuel ne m'affiche rien.
Si quelqu'un peut me donner une piste pour arriver au résultat escompté cela m'aiderait beaucoup.

Merci par avance aux personnes qui prendront le temps de réfléchir à mon problème.
Modifié par jpsmarno (09 Feb 2014 - 19:45)