OVH Cloud OVH Cloud

lire l'element selectionné d'un champ select

11 réponses
Avatar
grandmereScript
un grand bonjours a vous :))
voila, grand mere vous ecrit pour vous demander si vous savez (enfin je
sait que vous le savez) lire la valeur de l'element selectionn=E9 d'un
select...
cad :
<form name=3D"monform">
<select id=3DleSelect>
<option id=3D1>1</option>
<option id=3D2>2</option>
<option id=3D3>3</option>
<option id=3D4>4</option>
</select>
<input type=3Dsubmit onSubmit=3Dvalide(document.monform)
</form>

chez moi, cot=E9 js ca donne :
function valide(form) {
selectElementById('leSelect').value =3D=3D=3D> erreure =3D>il est null
form[leSelect+ "[]"] =3D=3D=3D> la meme erreure
}

dans l'attente de votre reponse informatis=E9e, veuillez agr=E9er
monsieur l'expression de mon caf=E9 distill=E9 :)

10 réponses

1 2
Avatar
grandmereScript
je precise pour plus de detail ?? :

au submit j'appelle la fonction valide() avec un parametre : mon
formulaire

dans la fonction valise, j'appelle une fonction qui valide les dates :
function verifDate(formulaire, idJours, idMois, idAnnee, idCible) {
}

avec formulaire : l'objet formulaire, idJours l'id du champ select
permettant de selectionner un jours, de meme pour idMois et idAnnee,
quand a idCible c'est un champ (hidden)dans lequel je fait une
agregation de ces trois valeurs (si elle sont valides) afin de n'avoir
qu'un seul apram a recup coté serveur.

donc je me demande si ma methode est viable : suis-je obligé de passer
les objet correspondant au lieu de passer un champ texte? (car :
formulaire.idJours.options ne fonctionne pas etant donné que il
faudrait prendre la valeur contenue dans idJours,j'ai alors essayé :
formulaire[idJours].options ca ne marche pas non plus...
et meme : formulaire[idJours + "[]"].options ...

donc est-ce un defaut de conception et dois-je revenir a passer des
objet en param (nuit a la lisibilité) ou est-ce un defaut de logique
(mauvais appel aux objet)

voili voilou! merci :)
Avatar
grandmereScript
on oublie totu, ca marche, j'ai envoyé les objet en param... et
constaté que j'avait une erreue de frappe (rah! le copier/coller...)

par contre, sous FF :

alert("formuliare jours : : " +
idMois.options[idMois.selectedIndex].value);
moisSelect = idMois.options[idMois.selectedIndex].value;

le alert marche => la bonne valeur est retourné, mais le second :
idMois.options as no propertie...
alors que juste au dessus ca marche...

:'( pourquoi???
Avatar
grandmereScript
en fait ca me met le messagfe pour les deux, mais ca m'affichaer quand
meme la valeur...
encore plus bizarre :
alert("formuliare jours : : " + idJours.options);

provoque deux alert :
- HTMLoptioncollection comme valeur
- undefined

le second a'afficahnt apres le clique sur ok du premeir ?!?
Avatar
ASM
grandmereScript wrote:
on oublie totu, ca marche, j'ai envoyé les objet en param... et
constaté que j'avait une erreue de frappe (rah! le copier/coller...)


Bon ...

on n'a pas besoin d'id dans les options
ni même dans les selects

Quand on a fait ses choix
la simple validation du formualire envoie en attaché
tous les choix de tous les selects :
truc.php?jours &mois=9&ans 05
(s'ils ont des values dans des options)

aucun besoin de JS

<form name="monform" action="truc.php">
Jours <select name="jours">
<option selected> </option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
.../...
<option value="31">31</option>
</select>
Mois <select name="mois">
<option selected> </option>
<option selected> </option>
<option value="1">1</option>
<option value="2">2</option>
.../...
<option value="12">12</option>
</select>
Annees <select name="ans">
<option selected> </option>
<option value="1999">1999</option>
<option value="2000">2000</option>
.../...
<option value="2005">2005</option>
</select>
<input type=hidden name="resume">
<input type=submit value="Envoi">
</form>

question de JS

on accede à l'otion sélectionnée d'un select d'un form
par la collection (ou arbre) des forms, puis celui des élémets

forms et selects doivent être nommés (facultatif pour form)

truc = document.forms['monForm'].elements['monSelect'];
choix = truc.options[truc.selectedIndex].value;

de passer par les ids (sans indiquer ce qu'il faut)
n'est pas une trop bonne idée mais peut se faire :

truc = document.getElementById('idMois');
choix = truc.options[truc.selectedIndex].value;

La méthode à la IE est à proscrire.

Sinon, en JS de nos Grands Pères :

function quelOpt(selecteur) {
var z = selecteur.selectedIndex;
return selecteur.options[z].value;
}
function getLaDate(monForm) {
var f = monForm;
if(quelOpt(f.jours)=='') alert('Jours omis');
else {
f.resume.value=quelOpt(f.jours);
if(quelOpt(f.mois)=='') alert('Mois omis');
else {
f.resume.value += '/' + quelOpt(f.mois);
if(quelOpt(f.ans)=='') alert('Annees omise');
else {
f.resume.value += '/' + quelOpt(f.ans);
// une verif en passant
alert(f.resume.value)
// c'est tt bon ? allez hop! on envoie
return true;
}
}
}
// une verif en passant
alert(f.resume.value);
// annulation d'envoi
return false;
}

et çà s'emploie directement dans le form :

<form name="monform" action="truc.php"
onsubmit="return getLaDate(this);">

si getLaDate() renvoie false : pas d'envoi
si getLaDate() renvoie true : hop! envoi


--
Stephane Moriaux et son [moins] vieux Mac

Avatar
ASM
grandmereScript wrote:
je precise pour plus de detail ?? :

au submit j'appelle la fonction valide() avec un parametre : mon
formulaire

dans la fonction valise, j'appelle une fonction qui valide les dates :
function verifDate(formulaire, idJours, idMois, idAnnee, idCible) {
}


comme tes éléments sont avec IDs ( id='idJours' )
ne pas se mélanger les pinceaux entre paramètres de fonction
et noms d'id !


function valide(formulaire) {
verifDate(formulaire, 'idJours', 'idMois', 'idAnnee', 'idCible');
}

function verifDate(formulaire, idJ, idM, idAn, idCbl)
var v = '';
v = formulaire.getElementById(idJ);
var z = v.selectedIndex;
v = v.options[z].value; // ou v = v.options[z].text; seln ce qu'on veut
if( v=='') alert('erreuurre jours');

v = formulaire.getElementById(idM);
var z = v.selectedIndex;
v = v.options[z].value; // ou v = v.options[z].text; seln ce qu'on veut
if( v=='') alert('erreuurre jours');

etc ...

}

avec formulaire : l'objet formulaire, idJours l'id du champ select
permettant de selectionner un jours, de meme pour idMois et idAnnee,
quand a idCible c'est un champ (hidden)dans lequel je fait une
agregation de ces trois valeurs (si elle sont valides) afin de n'avoir
qu'un seul apram a recup coté serveur.

donc je me demande si ma methode est viable : suis-je obligé de passer
les objet correspondant au lieu de passer un champ texte? (car :
formulaire.idJours.options ne fonctionne pas etant donné que il
faudrait prendre la valeur contenue dans idJours,j'ai alors essayé :
formulaire[idJours].options ca ne marche pas non plus...
et meme : formulaire[idJours + "[]"].options ...

donc est-ce un defaut de conception et dois-je revenir a passer des
objet en param (nuit a la lisibilité) ou est-ce un defaut de logique
(mauvais appel aux objet)

voili voilou! merci :)




--
Stephane Moriaux et son [moins] vieux Mac

Avatar
ASM
grandmereScript wrote:
je precise pour plus de detail ?? :

au submit j'appelle la fonction valide() avec un parametre : mon
formulaire

dans la fonction valise, j'appelle une fonction qui valide les dates :
function verifDate(formulaire, idJours, idMois, idAnnee, idCible) {
}


comme tes éléments sont avec IDs ( id='idJours' )
ne pas se mélanger les pinceaux entre paramètres de fonction
et noms d'id !


function valide(formulaire) {
verifDate(formulaire, 'idJours', 'idMois', 'idAnnee', 'idCible');
}

function verifDate(formulaire, idJ, idM, idAn, idCbl)
var v = '';
v = formulaire.getElementById(idJ);
var z = v.selectedIndex;
v = v.options[z].value; // ou v = v.options[z].text; seln ce qu'on veut
if( v=='') alert('erreuurre jours');

v = formulaire.getElementById(idM);
var z = v.selectedIndex;
v = v.options[z].value; // ou v = v.options[z].text; seln ce qu'on veut
if( v=='') alert('erreuurre jours');

etc ...

}

avec formulaire : l'objet formulaire, idJours l'id du champ select
permettant de selectionner un jours, de meme pour idMois et idAnnee,
quand a idCible c'est un champ (hidden)dans lequel je fait une
agregation de ces trois valeurs (si elle sont valides) afin de n'avoir
qu'un seul apram a recup coté serveur.

donc je me demande si ma methode est viable : suis-je obligé de passer
les objet correspondant au lieu de passer un champ texte? (car :
formulaire.idJours.options ne fonctionne pas etant donné que il
faudrait prendre la valeur contenue dans idJours,j'ai alors essayé :
formulaire[idJours].options ca ne marche pas non plus...
et meme : formulaire[idJours + "[]"].options ...

donc est-ce un defaut de conception et dois-je revenir a passer des
objet en param (nuit a la lisibilité) ou est-ce un defaut de logique
(mauvais appel aux objet)

voili voilou! merci :)




--
Stephane Moriaux et son [moins] vieux Mac

Avatar
grandmereScript
bon, merci de tes reponses tres precises :)

mais... j'ai reussi a faire "marcher" mon script (cf double alert du
message de dessus)

il est ainsi :
function valide(formulaire) {
if ( verifDate(formulaire, formulaire['JoursRevueRef'],
formulaire['MoisRevueRef'], formulaire['AnneeRevueRef'],
formulaire['MAJRevueDeRef']) == false) {
HTML = HTML + "Attention : la date saisie pour le champ Revue de
référentiel n'est pas valide !<br />Veuillez modifier votre
saisie.<br />";
isValid = false;
}
}
--------------
function verifDate(formulaire, idJ, idM, idAn, idCbl)
/.../
if (dateValide) {
//on transpose la date saisie en trois fois, dans le champ
correspondant :
idCible.value=joursSelect +'/'+ moisSelect +'/'+ anneeSelect;
// regex sur la date :
var regexDate = new RegExp("[0-3][0-9][/][0-1][0-9][/][0-9]{4}", "g");

if (!regexDate.test(idCible.value)) {
alert("on return false car : idCible.value = " + idCible.value);
return false;
}

} else {
alert("on return false - 2");
return false;
}
alert("on return true");
return true;
}
}
--------------
en realité,
dans ma fonction valide(),
j'appelle deux fois la fonction verifDate(),
--------------------
if ( verifDate(formulaire, formulaire['JoursRevueRef'],
formulaire['MoisRevueRef'], formulaire['AnneeRevueRef'],
formulaire['MAJRevueDeRef']) == false) {
HTML = HTML + "Attention : la date saisie pour le champ Revue de
référentiel n'est pas valide !<br />Veuillez modifier votre
saisie.<br />";
isValid = false;
}
alert("on a return : " + isValid);
if ( verifDate(formulaire, formulaire['JoursVeille"'],
formulaire['MoisVeille"'], formulaire['AnneeVeille"'],
formulaire['MAJVeille']) == false ) {
HTML = HTML + "Attention : la date saisie pour le champ veille
réglementaire n'est pas valide !<br />Veuillez modifier votre
saisie.<br />";
isValid = false;
}
alert("on a return : " + isValid);
------------------

ors, j'ai bien le premier : "alert("on a return : " + isValid);" mias
le second ne se declenche pas...
si la fonction fonctionne une fois, pourquoi pas deux??
Avatar
grandmereScript
merci, je veitn de comprendre ton explication sur les id et les nom qui
n'avaient pas besoin d'etre dedoublé, j'ai donc supprimmé les id,
puisque je selectionne les select par leur nom, et ca m'a bien
supprimmé le double affichage :)
Avatar
ASM
grandmereScript wrote:
merci, je veitn de comprendre ton explication sur les id et les


il faut, au minimum rappeller (en début)
une partie du message auquel on répond

Là je sais pas de quoi tu causes
(je n'ai pas tout appris par coeur ce que j'ai écrit)

Je pourrais remonter le fil mais ...


--
Stephane Moriaux et son [moins] vieux Mac

Avatar
grandmereScript

comme tes éléments sont avec IDs ( id='idJours' )
ne pas se mélanger les pinceaux entre paramètres de fonction
et noms d'id !

--
Stephane Moriaux et son [moins] vieux Mac



:D dsl


1 2