Sujet Précédent Sujet Suivant

Afficher un contenu aprés double selection

Fermé
Gaelle - 28 févr. 2012 à 08:01
AssassinTourist Messages postés 5710 Date d'inscription lundi 16 janvier 2012 Statut Contributeur Dernière intervention 29 février 2024 - 1 mars 2012 à 09:01
Bonjour,

J'aimerais afficher un contenu dans un textarea aprés une double sélection mais je n'arrive pas à trouver la formule adéquate.
Le but étant qd on sélectionne un mois et un jour, l'évènement associé s'inscrit dans le textarea.
ex : pour janvier / 1 / on clique sur bouton rechercher et le textarea=table_ev[0] etc... via la fonction modif() que je n'arrive pas à définir (enfin c surtout le nom de l'élément que je n'arrive pas à trouver !)
Je ne sais pas si je suis bien claire !! :-$

Mon code :

<html>
<head>
<title> Réunion / Evènements </title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript" src="./doubleselect/jquery.doubleSelect.js"> </script>
<script type="text/javascript">
<!--
$(document).ready(function()
{
var selectoptions = {
"Janvier": {
"key" : 10,
"defaultvalue" : 110,
"values" : {
"1": 110,
"5": 111,
"29": 112
}
},
"Février": {
"key" : 20,
"defaultvalue" : 210,
"values" : {
"5": 210,
"18": 211,
"23": 212
}
},
"Mars": {
"key" : 30,
"defaultvalue" : 310,
"values" : {
"2": 310,
"4": 311,
"27": 312
}
},
"Avril": {
"key" : 40,
"defaultvalue" : 410,
"values" : {
"10": 410,
"25": 411,
"30": 412
}
},
"Mai": {
"key" : 50,
"defaultvalue" : 510,
"values" : {
"1": 510,
"5": 511,
"29": 512
}
},
"Juin": {
"key" : 60,
"defaultvalue" : 610,
"values" : {
"1": 610,
"5": 611,
"14": 612
}
},
"Juillet": {
"key" : 70,
"defaultvalue" : 710,
"values" : {
"1": 710,
"5": 711,
"29": 712
}
},
"Aout": {
"key" : 80,
"defaultvalue" : 810,
"values" : {
"1": 810,
"10": 812
}
},
"Septembre": {
"key" : 90,
"defaultvalue" : 910,
"values" : {
"2": 910,
"11": 911,
"23": 912
}
},
"Octobre": {
"key" : 100,
"defaultvalue" : 1010,
"values" : {
"1": 1010,
"5": 1011,
"29": 1012
}
},
"Novembre": {
"key" : 110,
"defaultvalue" : 1100,
"values" : {
"7": 1110,
"28": 1111,
"29": 1112
}
},
"Décembre": {
"key" : 120,
"defaultvalue" : 1210,
"values" : {
"6": 1210,
"17": 1211,
"25": 1212,
"31": 1213
}
}
};
var options = {emptyOption: true};
$('#first').doubleSelect('second', selectoptions, options);
});
//-->
</script>
<script type="text/javascript">

var table_ev=new Array();
table_ev[0]=("Jour de l'an");
table_ev[1]=("Lorem ipsum dolor sit amet");
table_ev[2]=("Cras elementum ultrices diam");
table_ev[3]=("Lorem ipsum dolor sit amet");
table_ev[4]=("Cras elementum ultrices diam");
table_ev[5]=("Lorem ipsum dolor sit amet");
table_ev[6]=("Cras elementum ultrices diam");
table_ev[7]=("Lorem ipsum dolor sit amet");
table_ev[8]=("Cras elementum ultrices diam");
table_ev[9]=("Lorem ipsum dolor sit amet");
table_ev[10]=("Cras elementum ultrices diam");

function modif()
{
}

</script>
</head>
<body bgcolor="black">
<font face="georgia">
<table width="100%">
<tr align="center">
<td>
<a href="./index.html"> <img src="./photos/banderole1.png" alt="In Tour" border="0" width="100%"> </a>
</tr>
</table>
<table width="100%" border="0">
<tr>
<td width="14%"> </td>
<td width="12%" bgcolor="7fd13b" align="center" valign="middle"> <a href="./histoire_run.html"> <img src="./photos/icones/icone_histoire1.png" border="0" title="Histoire de la Réunion"/> </a> </td>
<td width="12%" bgcolor="7fd13b" align="center" valign="middle"> <a href="./lieux_run.html"> <img src="./photos/icones/icone_lieux1.png" border="0" title="Lieux à la Réunion"/> </a> </td>
<td width="12%" bgcolor="7fd13b" align="center" valign="middle"> <a href="./ev_run.html"> <img src="./photos/icones/icone_agenda1.png" border="0" title="Evènements à la Réunion" /> </a> </td>
<td width="12%" bgcolor="7fd13b" align="center" valign="middle"> <a href=" ./resto_run.html"> <img src="./photos/icones/icone_resto1.png" border="0" title="Restauration à la Réunion" /> </a> </td>
<td width="12%" bgcolor="7fd13b" align="center" valign="middle"> <a href="./hebergement_run.html"> <img src="./photos/icones/icone_heberg1.png" border="0" title="Hébergement à la Réunion"/> </a> </td>
<td width="12%" bgcolor="7fd13b" align="center" valign="middle"> <a href="./transport_run.html"> <img src="./photos/icones/icone_transport1.png" border="0" title="Transports à la Réunion" /> </a> </td>
<td width="14%"> </td>
</tr>
<tr>
<td width="14%" align="center" valign="top">
<p> <a href="./index.html"> <img src="./photos/icones/icone_accueil1.png" alt="Accueil" border="0" onmouseover="this.src='./photos/icones/icone_accueil2.png';" onmouseout="this.src='./photos/icones/icone_accueil1.png';"> </a>
</p>
<p> <a href="./destinations.html"> <img src="./photos/icones/icone_dest1.png" alt="Destinations" border="0"onmouseover="this.src='./photos/icones/icone_dest2.png';" onmouseout="this.src='./photos/icones/icone_dest1.png';"> </a>
</p>
<p> <a href="./references.html"> <img src="./photos/icones/icone_ref1.png" alt="Références" border="0"onmouseover="this.src='./photos/icones/icone_ref2.png';" onmouseout="this.src='./photos/icones/icone_ref1.png';"> </a>
</p>
<p> <a href="./contact.html"> <img src="./photos/icones/icone_contact1.png" alt="Contact" border="0"onmouseover="this.src='./photos/icones/icone_contact2.png';" onmouseout="this.src='./photos/icones/icone_contact1.png';"> </a>
</p>
</td >
<td colspan="6" bgcolor="7fd13b"align="justify" valign="top">
<p> <h3> <i> Evènements : </h3> </i> </p>
<p> Evènements principaux à l'Ile de la Réunion : </p>
<form name="f1">
<p> <select id="first" name="first" size="1"> </select>
<select id="second" name="second" size="1"> </select>
<input type="button" name="rechercher" value="Rechercher" onclick="modif()"> </p>
<textarea name="contenu"> </textarea>
</form>
</td>
<td valign="top" align="center">
<p> <img src="./photos/icones/bons_plans.png"/> </p>
</td>
</tr>
<tr>
<td> </td>
<td colspan="6" bgcolor="7fd13b" align="center"> <i> Copyright In tour 2012 </i> </td>
<td> </td>
</tr>
</table>
</font>
</body>
</html>



1 réponse

Réponse 1 / 1
AssassinTourist Messages postés 5710 Date d'inscription lundi 16 janvier 2012 Statut Contributeur Dernière intervention 29 février 2024 1 310
1 mars 2012 à 09:01
Bonjour,

J'ai eu la flemme de lire tout ton code, mais pour te donner une marche à suivre :

Dans ton code HTML, dans tes deux select (jour et mois), tu rajouteras 
onchange="modif()";

En javascript, tu récupères les valeurs de tes deux selects : https://javascript.developpez.com/faq/javascript/?page=formChamps#valSelect
Si jamais ils ne sont pas null ou vide ou égal à zéro (ça dépend de ce que renvoie ton option défaut)
Alors tu remplis ton textarea comme ceci : 
document.getElementById('id_textarea').innerHTML = text_a_mettre;


Petit point : En javascript on n'utilise pas les attributs name, mais plutôt id, donc il faudra rajouter des id dans tes champs html.
0

Discussions similaires

"L'indice n'appartient à la sélection" + VBA
fleur.31 -
geosevda -

2 réponses
Savoir de quel ville à été envoyé le message
pedro1209 -
Pierr10 -

7 réponses
comment ecrire un double cote " "
helmii -
[Dal] -

3 réponses
Afficher toutes les lignes masquées excel
livlarsen -
esicom -

26 réponses
Youtube: Ce contenu n'est pasdisponible dans votre pays
nesrinedu30 -
Ref1 -

10 réponses