Afficher un IFRAME selon un select
Résolu
pascalito92140
Messages postés
4
Date d'inscription
vendredi 3 février 2012
Statut
Membre
Dernière intervention
4 février 2012
-
3 févr. 2012 à 10:18
pascalito92140 Messages postés 4 Date d'inscription vendredi 3 février 2012 Statut Membre Dernière intervention 4 février 2012 - 4 févr. 2012 à 13:33
pascalito92140 Messages postés 4 Date d'inscription vendredi 3 février 2012 Statut Membre Dernière intervention 4 février 2012 - 4 févr. 2012 à 13:33
6 réponses
cs_jperre
Messages postés
268
Date d'inscription
lundi 9 janvier 2006
Statut
Membre
Dernière intervention
19 janvier 2017
2
3 févr. 2012 à 21:55
3 févr. 2012 à 21:55
Il y avait plus élégant comme code Javascript, en utilisant de l'instruction switch :
switch (type) {
case 0:
ifrAff.src="... (source 1ère monnaie)...";
break;
case 1:
ifrAff.src="... (source 2ème monnaie)...";
break;
case 2:
ifrAff.src="... (source 3ème monnaie)...";
break;
case 3:
ifrAff.src="... (source 4ème monnaie)...";
break;
...
}
Le code est moins lourd et plus facile à lire.
Bon courage!...
switch (type) {
case 0:
ifrAff.src="... (source 1ère monnaie)...";
break;
case 1:
ifrAff.src="... (source 2ème monnaie)...";
break;
case 2:
ifrAff.src="... (source 3ème monnaie)...";
break;
case 3:
ifrAff.src="... (source 4ème monnaie)...";
break;
...
}
Le code est moins lourd et plus facile à lire.
Bon courage!...
Zobibol
Messages postés
469
Date d'inscription
mercredi 9 janvier 2002
Statut
Membre
Dernière intervention
20 février 2017
6
3 févr. 2012 à 12:02
3 févr. 2012 à 12:02
Bien le bonjour,
l'attribut visibility=hidden sur l'iframe (n'existe pas).
il faut placer dans les tags style : display:none(caché) ou block(montré).
Si joint le code "légèrement" modifié:
[o-_-o]
l'attribut visibility=hidden sur l'iframe (n'existe pas).
il faut placer dans les tags style : display:none(caché) ou block(montré).
Si joint le code "légèrement" modifié:
<html>
<head>
<script type="text/javascript">
/**
* Changement de devise
*
* @param _select
* Select sur lequel s'appuyer pour determiner la bonne iframe à afficher/masquer.
*/
function changementType(_select) {
// Récupération de la valeur sélectionnée.
var type = _select.value;
// Type d'affichage pour la devise anglaise(block/none).
// L'affichage de la devise Euro sera l'inverse, si on _gbpDisplay == "block" alors cache l'iframe Euros.
var _gbpDisplay;
// passage par un switch plutôt qu'une série de if.
switch (type){
case "Euros":
//cache l'iframe GBP
_gbpDisplay = "none";
break;
case "GBP":
// montre l'iframe GBP
_gbpDisplay = "block";
break;
}
/**
* Petite note: le switch ci desssus peut être parfaitement remplacé par cette ligne:
* _gbpDisplay (type "Euros")? "none": "block";
* Mais d'un point de vue lisibilité le swich est plus approprié,
* D'un point de vue poid de page, c'est l'expression ternaire ci-dessus qu'il faut privilégier.
*/
// applique le style déterminé si dessus au contrôle concerné.
document.getElementById("GBP").style.display=_gbpDisplay;
// si le GBP est affiché, Euro est caché et inversement.
document.getElementById("Euros").style.display=(_gbpDisplay == "block") ? "none": "block";
}
</script>
</head>
<Form>
<select name="type" id="type" onchange="changementType(this);">
<option value="Euros">Euros</option>
<option value="GBP">GBP</option>
</select>
</Form>
</html>
[o-_-o]
cs_jperre
Messages postés
268
Date d'inscription
lundi 9 janvier 2006
Statut
Membre
Dernière intervention
19 janvier 2017
2
3 févr. 2012 à 12:48
3 févr. 2012 à 12:48
Pourquoi faire si compliqué et ne pas jouer sur l'attribut src d'un seul
<html>
<head>
<script type= "text/javascript">
function changementType(type) {
var ifrAff=document.getElementById("iframeaff");
if (type==0) {
ifrAff.src="https://sheet.zoho.com/publishrange.do?id=f836c5afc53f51a6f1b3cd9558401d38";
}
else {
ifrAff.src="https://sheet.zoho.com/publishrange.do?id=e2db64ef2215f65b6aa5776caf03cd66";
}
}
</script>
</head>
<form>
<select id="selmonnaie" onchange="changementType(this.selectedIndex)">
<option>Euros</option>
<option>GBP</option>
</select>
</form>
</html>
Voilà, c'est tout ce qui est nécessaire.
D'autre part, dans votre code Javascript, je vous signale que dans :
var type = document.getElementById("type").value; la propriété value de l'objet DOM
select n'existe pas, il faut passer par la collection options[] de l'objet en deux fois :
var idsel = document.getElementById("type").selectedIndex;
var type= document.getElementById("type").options[idsel].value;
<html>
<head>
<script type= "text/javascript">
function changementType(type) {
var ifrAff=document.getElementById("iframeaff");
if (type==0) {
ifrAff.src="https://sheet.zoho.com/publishrange.do?id=f836c5afc53f51a6f1b3cd9558401d38";
}
else {
ifrAff.src="https://sheet.zoho.com/publishrange.do?id=e2db64ef2215f65b6aa5776caf03cd66";
}
}
</script>
</head>
<form>
<select id="selmonnaie" onchange="changementType(this.selectedIndex)">
<option>Euros</option>
<option>GBP</option>
</select>
</form>
</html>
Voilà, c'est tout ce qui est nécessaire.
D'autre part, dans votre code Javascript, je vous signale que dans :
var type = document.getElementById("type").value; la propriété value de l'objet DOM
select n'existe pas, il faut passer par la collection options[] de l'objet en deux fois :
var idsel = document.getElementById("type").selectedIndex;
var type= document.getElementById("type").options[idsel].value;
pascalito92140
Messages postés
4
Date d'inscription
vendredi 3 février 2012
Statut
Membre
Dernière intervention
4 février 2012
3 févr. 2012 à 17:15
3 févr. 2012 à 17:15
Merci à tous les deux pour votre participation.
J'ai fait honneur à vos réponses en testant les deux versions.
Pour la version de Zobibol j'ai effectivement plus qu'un Iframe qui s'affiche et, de ce point de vue, c'est déjà une partie de mon problème qui est résolu.
Par contre, il est affiché dans le Form "euros" et c'est la version GBP de l'iframe qui s'affiche. Lorsque je sélectionne Euros pour qu'effectivement l'iframe "Euros" s'affiche rien ne se passe. Je sélectionne ensuite Gbp dans le form, rien ne se passe puisque j'ai déjà l'iframe Gbp. Si je sélectionne à nouveau euros, là, j'obtiens bien le bon iframe et la machine est lancée.
J'avais exactement le même problème dans ma première version
Pour la version de JPerre, tout fonctionne comme l'objectif fixé. Il ne me reste plus qu'à "multiplier les petits pains" et envisager d'autres devises. Je vais maintenant me pencher sur la compréhension du script.
Encore merci à vous deux pour votre précieuse aide et je vous souhaite un chaleureux week-end !!!
J'ai fait honneur à vos réponses en testant les deux versions.
Pour la version de Zobibol j'ai effectivement plus qu'un Iframe qui s'affiche et, de ce point de vue, c'est déjà une partie de mon problème qui est résolu.
Par contre, il est affiché dans le Form "euros" et c'est la version GBP de l'iframe qui s'affiche. Lorsque je sélectionne Euros pour qu'effectivement l'iframe "Euros" s'affiche rien ne se passe. Je sélectionne ensuite Gbp dans le form, rien ne se passe puisque j'ai déjà l'iframe Gbp. Si je sélectionne à nouveau euros, là, j'obtiens bien le bon iframe et la machine est lancée.
J'avais exactement le même problème dans ma première version
Pour la version de JPerre, tout fonctionne comme l'objectif fixé. Il ne me reste plus qu'à "multiplier les petits pains" et envisager d'autres devises. Je vais maintenant me pencher sur la compréhension du script.
Encore merci à vous deux pour votre précieuse aide et je vous souhaite un chaleureux week-end !!!
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
pascalito92140
Messages postés
4
Date d'inscription
vendredi 3 février 2012
Statut
Membre
Dernière intervention
4 février 2012
3 févr. 2012 à 18:19
3 févr. 2012 à 18:19
Messieurs re,
je viens de faire un essai en ajoutant basiquement un troisième élement mais cela ne fonctionnait pas. Je n'avait plus aucun tableau sur la page.
J'ai résolu le problème en faisant cela. Est-ce correct ?
if (type==0) {
}
else if (type==1){
}
else {
}
}
D'avance merci pour votre aide
je viens de faire un essai en ajoutant basiquement un troisième élement mais cela ne fonctionnait pas. Je n'avait plus aucun tableau sur la page.
J'ai résolu le problème en faisant cela. Est-ce correct ?
if (type==0) {
}
else if (type==1){
}
else {
}
}
D'avance merci pour votre aide
pascalito92140
Messages postés
4
Date d'inscription
vendredi 3 février 2012
Statut
Membre
Dernière intervention
4 février 2012
4 févr. 2012 à 13:33
4 févr. 2012 à 13:33
Grand merci pour votre aide...tout fonctionne correctement !!
Bon week à vous.
Pascal
Bon week à vous.
Pascal
