Bonjour à tous!!
J'ai une petite question car il me reste une chose à faire pour finaliser une page web et je n'y arrive pas XD
Pour résumer, je dois faire une page qui permet d'afficher des graph en format png; dans un premier temps j'ai mis en place une sélection car ces graph sont en fonction d'un service et d'une date en format "yyyy/mm" du coup j'ai fait ca avec un bouton display:
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31 <body> <div id="Service"> <span id="app"> <p>Sélectionnez un service :</p> <select id="select_app"> <option>-</option> <option>AttributionCodeConfidentiel</option> <option>bis</option> <option>bis.xindd</option> <option>crs</option> <option>crsCavimac</option> <option>crsCavimac.xindd</option> <option>crs.xindd</option> </select> </span> <span id="periode"> <p>Sélectionner une période: </p> <select id="select_periode"> <option>-</option> <option>Annuelle</option> <option>Mensuelle</option> </select> </span> <span id="date"> <p>sélectionner la date :</p> <input id="date-picker"/> </span> </div> <div> <center><button id="display">display</button></center> </div>
ensuite j'ai fait un div contenant les images en question :
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18 <div id="aff"> <img id="bis-global" src="bis.png"/> <img id="bis-2018/09" src="bis_201809.png"/> <img id="bis-2018/08" src="bis_201808.png"/> <img id="bis-2018/07" src="bis_201807.png"/> <img id="bis-2018/06" src="bis_201806.png"/> <img id="bis-2018/05" src="bis_201805.png"/> <img id="bis-2018/04" src="bis_201804.png"/> <img id="bis-2018/03" src="bis_201803.png"/> <img id="bis-2018/02" src="bis_201802.png"/> <img id="bis-2018/01" src="bis_201801.png"/> <img id="bis-2017/11" src="bis_201711.png"/> <img id="bis-2017/10" src="bis_201710.png"/> <img id="bis-2017/09" src="bis_201709.png"/> <img id="bis-2017/08" src="bis_201708.png"/> <img id="bis-2017/07" src="bis_201707.png"/> <img id="bis-2017/06" src="bis_201706.png"/> </div>
PS : je ne vous ais mis qu'un échantillon ^^
et du coup j'ai écris ce script en jquery :
et c'est la dernière partie qui me pose problème, c'est la sélection de l'attribut qui est peut être pas bonne
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61 $(document).ready(function(){ var periode = '', service = '', date = '', $btn_display = $("#display",) $select_app = $("#select_app"), $select_periode = $("#select_periode"), $date = $("#date-picker"), $img = $('#aff img'), $aff = $('#aff'); service = $('#select_app option:selected').text(); periode = $('#select_periode option:selected').text(); date = $('#date-picker').text(); $aff.hide(); $('#Service #date').hide(); $select_periode.on('change',function(){ periode = $('#select_periode option:selected').text(); if (periode == "Annuelle") { $('#Service #date').css('display', 'none'); } else { $('#Service #date').css('display', 'block'); } }); $select_app.on('change',function(){ service = $('#select_app option:selected').text(); }); $date.datepicker({ dateFormat: 'yy/mm', changeMonth: true, changeYear: true, showButtonPanel: true, onClose: function(dateText, inst) { var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val(); var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val(); $(this).datepicker('setDate', new Date(year, month, 1)); } }); $btn_display.click(function(){ var ide =""; service = $('#select_app option:selected').val(); periode = $('#select_periode option:selected').val(); date = $('#date-picker').val(); if (periode === "Annuelle") { ide = service+"-global"; //console.log(ide); $("img[id=ide]").show(); } else { ide = service+"-"+date; console.log(ide); $("img[id=ide]").show(); } }); });
je vous remercie pour votre aide![]()
Partager