Actuellement sur le projet d'un site utilisant de la géolocalisation, j'ai mis en place un formulaire pour que les personnes intéressés puisse ajouter des renseignements sur certains point d’intérêt qu'ils connaissent, lu ou on entendu parlé(légendes, contes, petites histoires d'autrefois autour d'un lieu dit de la région concernées)
Depuis le départ je découvre seul au fur à mesure d'essai, d'erreur et de test javascript, jquery php et touti quanti, en fait c'est un peu un défi que je me suis lancé :-) Mais là je n'arrive décidément pas à trouver la solution et j'en appelle à votre aide si quelqu'un peu me dire comment faire. Milles excuses si mon codage n'est pas très propre et si c'est un peu mixé entre Jquery et Javascript, je débute alors je découvre les subtilités en même temps. Le précédent site perso que j'avais fait c'était en 98... Ca a bien évolué!
Coté Html j'ai un Input pour la commune dont une datalist est crée au fur à mesure via la fonction suggestcomm() incorporant des options grâce à des suggestions du géoservice de l'IGN et un Input lieu dit avec sa datalist crée via la fonction suggestlieu() venant du même service proposant cette fois uniquement les lieux dit en fonction de la commune sélectionnée précédemment.
Si l'on ne connais pas la commune (la découpe communale est parfois très étrange), donc l'input "Commune" vide, la fonction suggestlieu() permet d'ajouter un label avec une possibilité de commune correspondante pour guider l'utilisateur dans sa sélection et récupérer du même coup le lieu dit et la commune:
for (var i=0; i < lieudit.length;++i){
if (commune==""){adtext[i]=lieudit[i].split(", ")[1]}else{adtext[i]=" "};
str += '<option id="SugLieuDit('+[i]+')" value="'+lieudit[i].split(", ")[0]+'" label="'+adtext[i]+'" />';
}
$('#SugLieuDit').html(str);
Ensuite avec cette fonction onchange cela retourne le label de l'option en fonction de sa valeur dans l'input "commune" :
Par contre si il y a plusieurs option value/lieux-dit de la même valeur (par exemple beaucoup de commune possède un lieu dit "le châtelard" dans ma région...) cela me retourne toujours la première occurrence (normal puisque je lui demande en fonction de option[value=""], il prend la première qui lui vient sous la main. on('change' n'est peut être pas la bonne solution? Je n'ai pas trouvé autre chose qui fonctionne pour le moment.
Qu'est ce que je peux mettre pour que l'option sélectionnée soit définie en fonction du label de l'option ou de son id et pas de sa valeur ? Ou au moins que je récupère la valeur de l'id ou le label de l'option réellement sélectionnée pour l'inscrire dans l'input précédente.
En résumé : comment récupérer, en Jquery si possible, l'id ou le label d'une option sélectionnée incluse dans data-list pouvant posséder des valeurs d'options identiques.
Merci d'avance de votre aide ou juste une piste de syntaxe, quitte à ce que je cherche dans le bon sens parce que là je sèche totalement. Bonne soirée et bonne journée à tous.
C'est étrange la démonstration que vous m'avez faites a fonctionné la première fois puis plus du tout?!? Cela me retourne toujours l'id 1 si je clique sur "endroit 1" option 3 Désolé pour mon explication mais vous avez compris le souci.
Malheureusement je n'ai pas vraiment le choix de valeurs différentes parfois elles sont identiques.
je vous fait l'exemple plus clair :
<datalist id="dl">
<option id="1" label="Paris" value="Rue Victor Hugo">
<option id="2" label="Marseille" value="Impasse Victor Hugo ">
<option id="3" label="Lyon" value="Rue Victor Hugo">
</datalist>
Si la personne rentre Vict... cela lui donne trois suggestions : 2 rues du même nom dans 2 villes différentes et une impasse.
Ce que je souhaiterais c'est que la personne puisse sélectionner par exemple la Rue Victor Hugo à Lyon et que le code me renvoie la valeur du label correspondant c'est à dire "Lyon" et non pas "Paris" qui est la première occurrence.
J'ai bien un input dans mon code pour préciser la ville/commune, dans ce cas là, le souci ne se pose pas car cela permet de filtrer les résultats. Mais en général par exemple quand je recueille une légende auprès des personnes, elles me répondent "c'est en haut de la colline au dessus de tel commune ça s'appelle 'la pierre machin chose'." C'est assez flou... En général le lieu-dit à gardé le nom d'usage mais il est situé administrativement sur une autre commune que celle annoncée, d'où la nécessité de pouvoir la suggérer facilement.
Vraiment merci en tout cas de votre aide et du code, je vais l'essayer de mon coté pour voir pourquoi ça ne fonctionne plus.
Ça me fait ça aussi des fois sur JSBin, mais je pense qu'un export du code en HTML permettra de le tester sans problème. Je comprends maintenant mieux le problème et en effet, il n'y a finalement pas de redondance dans le datalist. Il serait peut-être intéressant d'afficher le label dans la valeur, comme ça l'utilisateur choisit la bonne adresse :
<datalist id="dl">
<option id="1" label="Paris" value="Rue Victor Hugo (Paris)">
<option id="2" label="Marseille" value="Impasse Victor Hugo (Marseille)">
<option id="3" label="Lyon" value="Rue Victor Hugo (Lyon)">
</datalist>
Nodo : Bibliothèque JS pour manipuler le DOM facilement.
Nodo : Bibliothèque JS pour manipuler le DOM facilement.