11522 sujets

JavaScript, DOM et API Web HTML5

Pages :
(reprise du message précédent)

Salut

Je viens de faire une autre remarque, tu as dupliqué ton id="DIV_MOVE_MENU" plusieurs fois, ce n'est pas admis, l'id est unique sur toute la page.
En effet sur le code entier que tu as fourni là haut, tu n'appelles pas ta fonction select_country() que sur le clique sur les liens, c'est pour cela que j'ai dû enlever le change sur le select.
Alors dans ce cas et si tu voudras faire appel aussi à ta fonction qui charge les datas au change du select, je vais procéder à travers, mais en se basant sur ce que tu as déjà fait, sachant qu'il y a des façon plus propre à le faire, mais vu que c'est une longue question, et qu'il va falloir que tu te formes pour connaitre les bons pratiques.

Voilà comment tu vas agir relativement à ta structure et ta logique pour charger aussi les données:

$(function(){

	/*l'appel de cette fonction doit être fait ici (Dans le ready) pour le départ/chargement
	Le même problème, tu fait appel au select avant qu'il soit prêt sur ton DOM*/
	
	select_country ("world",false);
	$('#select_year').on('change',function(){
		var sl=$('.selected_country');
		var cntry= (sl.length ? sl.eq(0).text().toLowerCase() : 'world');
		select_country (cntry,false)
	});
	
	/*Les autres appelles de cette fonction tu les gères à travers ton html
	Il y a une meilleure façon pour le faire, mais pour le moment, je réctifie le nécessaire
	et à toi de te documenter un peu au futur*/


});

//Déclaration de la fonction select_country
function select_country (thecountry,clspross) {

	//La mise en place de la class selected_country pour distingué le pays choisi
	//L'argument clspross est facultatif et je l'ai ajouté pour ne pas modifié ce que tu as fait niveau ton html
	//et pour faire dictinction entre les appeles sur le clique et les appelles directes de la fonction.
	if(typeof(clspross)=='undefined'){
		$('.selected_country').removeClass('selected_country');
		$(this).addClass('selected_country');
	}
	
	//La déclaration de tes variables va se faire ici en tant que variables locales de la fonctions
	//(Les variables globales sont à éviter que pour le prémordiale)
	var selected_year=$('#select_year').val();
	
	var url="type_data=Job&type_areaOUcountry=Learner_Country&nom_data=postsales&year=" + selected_year + "&month=all&areaOUcountry=";	
	ajax_call (url + thecountry);
	url="type_data=Job&type_areaOUcountry=Learner_Country&nom_data=presales&year=" + selected_year + "&month=all&areaOUcountry=";
	ajax_call (url + thecountry);
	url="type_data=Job&type_areaOUcountry=Learner_Country&nom_data=sales&year=" + selected_year + "&month=all&areaOUcountry=";
	ajax_call (url + thecountry);
	url="type_data=Job&type_areaOUcountry=Learner_Country&nom_data=trainer&year=" + selected_year + "&month=all&areaOUcountry=";
	ajax_call (url + thecountry);
	url="type_data=Int_Ext&type_areaOUcountry=Learner_Country&nom_data=internal&year=" + selected_year + "&month=all&areaOUcountry=";
	ajax_call (url + thecountry);
	url="type_data=Int_Ext&type_areaOUcountry=Learner_Country&nom_data=external&year=" + selected_year + "&month=all&areaOUcountry=";
	ajax_call (url + thecountry);
	url="type_data=Type&type_areaOUcountry=Learner_Country&nom_data=certif exam&year=" + selected_year + "&month=all&areaOUcountry=";
	ajax_call (url + thecountry);
	url="type_data=Type&type_areaOUcountry=Learner_Country&nom_data=course&year=" + selected_year + "&month=all&areaOUcountry=";
	ajax_call (url + thecountry);
	url="type_data=Type&type_areaOUcountry=Learner_Country&nom_data=webinar&year=" + selected_year + "&month=all&areaOUcountry=";
	ajax_call (url + thecountry);
	url="type_data=Type&type_areaOUcountry=Learner_Country&nom_data=specific certification&year=" + selected_year + "&month=all&areaOUcountry=";
	ajax_call (url + thecountry);
	url="type_data=Type&type_areaOUcountry=Learner_Country&nom_data=certification&year=" + selected_year + "&month=all&areaOUcountry=";
	ajax_call (url + thecountry);
	url="type_data=Type&type_areaOUcountry=Learner_Country&nom_data=laboratory&year=" + selected_year + "&month=all&areaOUcountry=";
	ajax_call (url + thecountry);
	url="nom_duration=classroom&year=" + selected_year + "&month=all&country=";
	ajax_call (url + thecountry);
	url="nom_duration=elearning&year=" + selected_year + "&month=all&country=";
	ajax_call (url + thecountry);
}

//la fonction d'appel Ajax
function ajax_call(what2do){
	$.ajax({
		type: "GET",
		dataType: "json",
		url: "data.php?" + what2do,
		success: function(json) {
			var nom = json['nom'];
			nom = nom.replace(" ","_");
			if (nom == "classroom" || nom == "elearning"){
				$('#id' + nom + 'data').html(json['duration']+ " days");
			}
			else {
				$('#id' + nom + 'data').html(json['ladata']);			
			}			
		}
	});
};


Je n'ai pas testé le code, à toi de la faire, et je te conseille vivement de réviser tes bases Smiley smile

J'espère que ça résout ton problème

Bonne courage

Edition: J'ai corrigé une erreur sur ça dans mon script var sl=$('.selected_country'); j'ai voulu mettre le false, pour la fonction select_country et je me suis trompé Smiley langue
Modifié par unami (25 Apr 2012 - 20:30)
Oula c compliqué tout ca :O XD

Bah en fait j'ai jamais eu de base quoi ..... de la viens tout le probleme .... quand j'ai été recruté pour ce poste en alternance je devais faire du visual basic, et apres on m'a demandé e faire de la programmation web, et faire un site dynamique avec de l ajax et tout .... alors que j'ai jamais fait de prog web de ma vie .... donc voila pourquoi il y a des problemes de structure et de logique ....

Ici en plus personne peut m'aider .....

En tout cas merci a toi, et aux autres personnes sur ce forum, qui m'aident =)

je vais voir et essayer de comprendre ce que tu as fait =)
j'arrive pas à le faire marcher Smiley bawling

Ca fait comme avant c'est à dire qu'au démarrage ca met bien les valeurs pour le monde et pour 2011 mais si je change le select et met 2012, ca ne fait rien Smiley bawling

le select je le laisse bien comme ca ?

<div id="DIV_MOVE_MENU">Year</div> <br/>
			<div id="DIV_MOVE_SOUS_MENU">	
				<p>
					<select id = "select_year"	>
						<option value= "2011">2011</option>
						<option value= "2012">2012</option>
					</select>
				</p><br/>
			</div>	
En fait je vois pas comment marche la classe selected_country pour distinguer le pays choisi ici .....
je vois pas ou elle peut connaitre le pays qui est choisi .....
On lui dit a aucun moment que le "thecountry" de la fonction select_country correspond au pays sélectionné ....

En espérant que qqun pourra m'éclaircir sur ce point ....


Et pis: "var cntry= (sl.length ? sl.eq(0).text().toLowerCase() : 'world')"
ca renvoit toujours world d apres ce que j'ai vu ? En fait franchement je comprend pas du tout cette ligne .... Smiley decu



EDIT:
J'ai modifié un peu le code parce qu'il ne reconnaissait pas le onchange et j'ai fait ca:

$(function(){
	select_country ("world",false);			
});

function select_change() {
	alert ("coucou");
	var sl=$('.selected_country');
	var cntry= (sl.length ? sl.eq(0).text().toLowerCase() : 'world');
	select_country (cntry,false)
}


<select id="select_year" onchange ="select_change();">
	<option value= "2011">2011</option>
	<option value= "2012">2012</option>
</select>	



Donc maintenant quand je change la valeur du select ca change bien les valeurs en direct, le soucis c'est que comme je disais cntry est toujours égale a world donc du coup si je change la valeur du select pour 2011 ca va me mettre les valeur du monde pour 2011 et si je choisis 2012 ca va me mettre les valeurs du monde pour 2012 .... mais ca va pas tenir compte du pays que j'avais sélectionné précédemment ....

Si au départ je clique sur france, ca m affiche les valeur de la france pour la date qui est dans le select a ce moment, mais si ensuite je change la date au lieu de mettre les valeurs pour la france avec la nouvelle date, ca va me mettre les valeurs du monde .....

J'espere que c'est clair ... XD si y a quelque chose que vous avez pas compris dans mon explication de mon probleme, demandez moi svp, du moment que ca peut vous aider à m aider ^^


En espérant que quelqu'un pourra m aider =)






EDIT:
J'ai utilisé une variable globale en mettant:

"save_country = thecountry;" dans la fonction select_country

Pour ensuite faire:

function select_change() {
select_country (save_country,false)
}


Mais apparemment c'est pas bien donc si vous avez une meilleur solution =)

Modifié par InfoGeo (04 May 2012 - 12:17)
Pages :