Comment fermer toggle ?

**chanteur06** · 25/03/2016, 10h04

Hello
J'ai un soucis , un toggle qui reste ouvert au lancement du resultat, du coup sur mobile le haut de page est masqué, pas cool ..
Comment le fermer..?

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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
<script> 
 
// read fields from the advanced search form and call back the same page with parameters
function doSearch() {
	var panel = $("#searchoptions");
	var search = document.getElementById('recherchetext').value;
	// using the advanced search options
	if (panel.css('display') != 'none') {
		var rb1 = document.getElementById('rb_note').checked;
		var rb2 = document.getElementById('rb_avg').checked;
		var rb3 = document.getElementById('rb_less').checked;
		var rb4 = document.getElementById('rb_more').checked;
		var rapportqp = document.getElementById('rapportqp').checked;
 
		var note1 = document.getElementById('avec_note').checked;
		//var note2 = document.getElementById('sans_note').checked;
		var video1 = document.getElementById('avec_video').checked;
		//var video2 = document.getElementById('sans_video').checked;
		var mange1 = document.getElementById('mange').checked;
		//var mange2 = document.getElementById('pas_mange').checked;
		var maxcost = document.getElementById('maxcost').value;
 
		document.location.href = "resultats.php?recherche=" + escape(search)
			   + "&maxcost=" + maxcost
			   + "&review=" + (note1?1:3)  // (note1+2*note2)	
			   + "&video="  + (video1?1:3) // (video1+2*video2)	
			   + "&mange="  + (mange1?1:3) // (mange1+2*mange2)
			   + "&sort="   + (rb1+2*rb2+3*rb3+4*rb4)
			   + "&rapportqp=" + (rapportqp?1:0);
	} else { // not using the advanced search options
		var maxcost = document.getElementById('maxcost2').value;
		document.location.href = "resultats.php?recherche=" + escape(search) + "&maxcost=" + maxcost;
	}
	return false;
}
// Expand / collapse the advanced search panel
function toggleAdvancedSearch() {
	var option1 = $("#option1");
	var panel = $("#searchoptions");
	var btn   = $("#advsearchbutton");
	if (panel.css('display') == 'none') {
		panel.show();
		option1.hide();
		btn.removeClass("advsearchbuttondown").addClass("advsearchbuttonup");
	} else {
		panel.hide();
		option1.show();
		btn.removeClass("advsearchbuttonup").addClass("advsearchbuttondown");
	}
}
 
// do search on enter key pressed
function enterKey(e)  {
  	if (typeof e == 'undefined' && window.event) 
  		e = window.event; 
	if (e.keyCode == 13) 
		doSearch();
 }
</script>  
<!--form id='formsearch' action="resultats.php" method="get" name="form_search"-->
 
    <input class="input-search" placeholder="Entrez une ville ou resto ou plat..." type="search" id="recherchetext" 
	value="<?php echo htmlentities($_SESSION["recherche"]);?>" onkeypress="enterKey(event)" />
	<input class="recherche" type="button"  value="Go!" name="submit_search" onclick="doSearch()" title='Rechercher'"/> 
	<div id='advsearchbutton' class="advsearchbuttondown" onclick="toggleAdvancedSearch()" title='Cliquez pour une recherche avancée'>
	<a class="advsearchbuttondown"></a></div> 
	<div id='option1' ></div>
	<!--<div id='option1' style='<?php if ($_SESSION["sort"]>'') echo "display:none" ?>'>
		Pas plus de &nbsp; &nbsp;<input id='maxcost2' style="width:50px;text-align:right" type="number" min="1" step="1" 
		onkeypress="enterKey(event)" value="<?php echo $_SESSION['maxcost']?>"> &euro; par personne
	</div><br>-->
	<!-- content of the popup window with the advanced search options -->
	<div id='searchoptions' style='<?php if ($_SESSION["sort"]=='') echo "display:none" ?>'>
		<!--<table style='width:100%'> 
			<tr><td style='padding: 8px 0 0 5px;'><strong>Recherche avancée</strong></td><tr>
		</table>-->
		<div class="searchbarA">
		<table class="searchtable">
			<tr class="tr-search">
			<td class="td-search">Trier par :</td>
			<td class="radio-search">
			<input class="input-radio" type='radio' name='rbsort' id='rb_note'  <?php if ($_SESSION['sort']<'2')  echo "checked"; ?>><span class="span-radio">note</span>
				<input class="input-radio" type='radio' name='rbsort' id='rb_avg'  <?php if ($_SESSION['sort']=='2') echo "checked"; ?>><span class="span-radio">Prix moyen</span>
				<input class="input-radio" type='radio' name='rbsort' id='rb_less' <?php if ($_SESSION['sort']=='3') echo "checked"; ?>><span class="span-radio">Menu moins cher</span> 
				<input class="input-radio" type='radio' name='rbsort' id='rb_more' <?php if ($_SESSION['sort']=='4') echo "checked"; ?>><span class="span-radio">Menu plus cher</span>
			</td></tr>
 
			<tr><td style='text-align:right;vertical-align:baseline'>Avec&nbsp;&nbsp;</td>
			    &nbsp;<td colspan="2"><input class="input-radio" type='checkbox' id='rapportqp' <?php if ($_SESSION['rapportqp']=='1') echo "checked"; ?>><span class="span-radio-A">&nbsp;meilleur RQP</span> <input class="input-radio" type='checkbox' id='avec_note' <?php if ($_SESSION['review']=='1') echo "checked"; ?>><span class="span-radio">&nbsp; un article d&eacute;taill&eacute;</span> &nbsp; &nbsp;
					<!--<br><input type='checkbox' id='sans_note' <?php if ($_SESSION['review']!='1') echo "checked"; ?>>&nbsp;sans article d&eacute;taill&eacute;-->
					<input class="input-radio" type='checkbox' id='avec_video' <?php if ($_SESSION['video']=='1') echo "checked"; ?>><span class="span-radio-A">&nbsp;une video&nbsp; &nbsp;&nbsp;  </span> 
					<!--<br><input type='checkbox' id='sans_video' <?php if ($_SESSION['video']!='1') echo "checked"; ?>>&nbsp;sans video-->
					<input class="input-radio" type='checkbox' id='mange' <?php if ($_SESSION['mange']=='1') echo "checked"; ?>><span class="span-radio">&nbsp;On a Testé</span>
					<!--<br><input type='checkbox' id='pas_mange' <?php if ($_SESSION['mange']!='1') echo "checked"; ?>>&nbsp;non visité-->
 
				</tr>
			<tr></tr>
		</table>
		<table class="searchtable-B">
			<tr><td>&nbsp;Pas plus de</td><td><input id='maxcost' style="width:60px;text-align:right" type="number" min="1" step="1" onkeypress="enterKey(event)"
			 value="<?php echo $_SESSION['maxcost']?>">&nbsp;&euro; par personne</td>
			 </tr>
		</table>
 
		</div>
	</div>
 
<!--/form-->

**danielhagnoul** · 25/03/2016, 13h35

En jQuery, pour créer un gestionnaire d'événement on utilise la méthode on() et pour supprimer un gestionnaire d'événement on utilise la méthode off().

Dans un code qui mélange tout (jQuery, Vanilla JS et du PHP), je ne sais pas !

**chanteur06** · 25/03/2016, 16h16

ok merci danielhagnoul, je vais voir ce que je peux faire en mettant une balise off quelque part ^^

**chanteur06** · 25/03/2016, 17h40

Trouvé :-)

En fait, une partie du code qui cache le toggle et le remet à zéro ( pas de façon académique apparemment) avait disparu

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

style='<?php if ($_SESSION["sort"]>'') echo "display:none" ?>'

dans le DIV caché option1

En ajoutant cette partie de code, le toggle apparait caché au rechargement de la page, et donc le resultat est ok ;-)

**chanteur06** · 26/03/2016, 13h15

Nan...j'ai été un peu vite, l'affichage ne se " dé-toggle pas " malgré la ligne de code...quelqu'un saurait me guider..? merci ;-)

Comment fermer toggle ?

JavaScript

Vue hybride

Discussions similaires

Partager

Partager