PC SOFT

FOROS PROFESIONALES
WINDEV, WEBDEV y WINDEV Mobile

Inicio | Mensajes recientes | Conéctese... |  | Español FR
Inicio → WEBDEV 2024 → Récupérer alert() d'une iframe pour alimenter champs de saisie
Récupérer alert() d'une iframe pour alimenter champs de saisie
Iniciado por Michel Fil, 30,oct. 2018 11:38 - 23 respuestas
#1
Publicado el 30,octubre 2018 - 11:38
Bonjour,

Dans une page j'ai placé un champ Iframe sur lequel j'affiche en IFrame1..HTMLAprès une chaine html qui construit une carte OpenStreetMap. Ça fonctionne correctement.

Dans la chaine j'ajoute la fonction alert() histoire d'afficher la LAT du marker :
MapsReseau+="marker.on('click', function(e) { alert( e.latlng.lat +e.latlng.lng )});"


J'aimerai connaitre le principe pour extraire cette LAT qui alimenterai un champ de saisie qui se trouve sur ma page.

En Windev pas de problème, en Webdev je n'y arrive pas.

Si quelqu'un a déjà rencontré ce problème.

Cordialement
Michel
#2
Miembro registrado
950 mensajes
Popularité : +53 (63 votes)
Publicado el 30,octubre 2018 - 20:32
Bonjour,

pourquoi as-tu besoin d'une iframe ?

un champs html ne suffit pas ?

Jordan
#3
Publicado el 31,octubre 2018 - 07:09
Bonjour,

Après plusieurs tests ça semblait répondre à mes attentes.
Ifram ou Html mon problème reste le même.
En windev j'utilise
//Lance la recherche du click
ActiveXEvénement(ClicActiveX,AX_Carte1,"TitleChange")

qui me permet de récupérer le nom associé au marker.
En webdev ???

Michel
#4
Miembro registrado
950 mensajes
Popularité : +53 (63 votes)
Publicado el 31,octubre 2018 - 11:31
Ce que je veux dire, c'est que j'utilise openstreetmap en full webdev, et que je n'utilise pas d'iframe pour le charger, et effectuer des action dessus,

En windev, vous utiliser l'evenement de changement de titre de l'objet activeX (qui utilise IE bouu pas beau), mais je suis d'accord ca fonctionne,

L'idee en webdev c'est d'utiliser les fonction navigateur pour faire ce que vous voulez.

Utilisez un champs html pour afficher la carte, creer une procedure locale navigateur JS pour charger les fonctions d'openstreetmap, et declarer des procedure local navigateur webdev à appeler depuis le clic sur les marqueur, et faire ce que vous voulez avec.

Actuellement j'utilise leaflet pour faire ce dont je souhaite.

Jordan
#5
Publicado el 31,octubre 2018 - 13:17
Merci pour ces informations.
Je teste et reviens vers vous.
Cordialement
Michel
#6
Publicado el 02,noviembre 2018 - 10:40
Bonjour Jordan,

Pour tout dire je débute en Webdev.
Sur un forum j'ai trouvé :
L.marker([51.5, -0.09]).addTo(mymap)
.bindPopup("<b>Hello world!</b><br />I am a popup.").openPopup().on('click',clicSurUnObjet);

Le clicSurUnObjet est une procédure locale (navigateur) :
Procedure clicSurUnObjet(e)
Saisie1=e.latlng.toString()
ToastAffiche("clicSurUnObjet"+RC+"Vous avez cliqué sur "+e.latlng.toString())


Je récupère bien l'information sur le champ Saisie1 lorsque ma procédure est en MaPage..HTMLFinPage=Chaine html
Comment puis je faire de même sur un champ HTML et non la page ?

Cordialement
Michel
#7
Miembro registrado
950 mensajes
Popularité : +53 (63 votes)
Publicado el 02,noviembre 2018 - 14:15
Bonjour,

peux-tu nous montrer le code que tu as mis pour comprendre ce que tu as fait ?

jordan
#8
Publicado el 02,noviembre 2018 - 16:00
Bonjour
Je reviendrai vers vous prochainement congé oblige
Je vous ferai parvenir le code
Merci
Michel
#9
Publicado el 12,noviembre 2018 - 09:10
Bonjour et désolé du retard de réponse,

Ci-joint deux exemples.
Le premier est lancé en initialisation de la page (serveur) et fonctionne.
Je récupère bien la LAT via la procédure locale (navigateur) "ClicSurUnObjet.
MaPage..HTMLEntête =
[
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css" integrity="sha512-M2wvCLH6DSRazYeZRIm1JnYyh22purTM+FDB5CsyxtQJYeKq83arPe5wgbNmcFXGqiSH2XR8dT/fJISVA1r/zQ==" crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.2.0/dist/leaflet.js" integrity="sha512-lInM/apFSqyy1o6s89K4iQUKg6ppXEgsVxT35HbzUupEVRh2Eu9Wdl4tHj7dZO0s1uvplcYGmt3498TtHq+log==" crossorigin=""></script>
]

MaPage..HTMLFinPage= [
<div id="mapid" style="width: 600px; height: 400px;"></div>
<script>
var mymap = L.map('mapid').setView([51.505, -0.09], 13);

L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
maxZoom: 18,
attribution: 'Map Data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
'<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-by-SA</a>, ' +
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
id: 'mapbox.streets'
}).addTo(mymap);

L.marker([51.5, -0.09]).addTo(mymap)
.bindPopup("<b>Hello world!</b><br />I am a popup.").openPopup().on('click',clicSurUnObjet);

L.circle([51.508, -0.11], 500, {
Color: 'red',
fillColor: '#f03',
fillOpacity: 0.5
}).addTo(mymap).bindPopup("I am a circle.").on('click',clicSurUnObjet);

L.polygon([
[51.509, -0.08],
[51.503, -0.06],
[51.51, -0.047]]).addTo(mymap).bindPopup("I am a polygon.").on('click',clicSurUnObjet);

var popup = L.popup();

mymap.on('click', clicAilleursSurLaCarte);

</script>
]


Procédure Locale navigateur
Procedure clicSurUnObjet(e)
Saisie1=e.latlng.toString()
Trace(e.latlng.toString())
ToastAffiche("clicSurUnObjet"+RC+"Vous avez cliqué sur "+e.latlng.toString())


Ce second code alimente un champ HTML et n'affiche pas au delas du marker et ne me donne pas la LAT :
HTML1=
[
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.2.0/dist/leaflet.css" integrity="sha512-M2wvCLH6DSRazYeZRIm1JnYyh22purTM+FDB5CsyxtQJYeKq83arPe5wgbNmcFXGqiSH2XR8dT/fJISVA1r/zQ==" crossorigin=""/>
<script src="https://unpkg.com/leaflet@1.2.0/dist/leaflet.js" integrity="sha512-lInM/apFSqyy1o6s89K4iQUKg6ppXEgsVxT35HbzUupEVRh2Eu9Wdl4tHj7dZO0s1uvplcYGmt3498TtHq+log==" crossorigin=""></script>

<div id="mapid" style="width: 600px; height: 400px;"></div>
<script>
var mymap = L.map('mapid').setView([51.505, -0.09], 13);

L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpejY4NXVycTA2emYycXBndHRqcmZ3N3gifQ.rJcFIG214AriISLbB6B5aw', {
maxZoom: 18,
attribution: 'Map Data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
'<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-by-SA</a>, ' +
'Imagery © <a href="http://mapbox.com">Mapbox</a>',
id: 'mapbox.streets'
}).addTo(mymap);

L.marker([51.5, -0.09]).addTo(mymap)
.bindPopup("<b>Hello world!</b><br />I am a popup.").openPopup().on('click',clicSurUnObjet);

L.circle([51.508, -0.11], 500, {
Color: 'red',
fillColor: '#f03',
fillOpacity: 0.5
}).addTo(mymap).bindPopup("I am a circle.").on('click',clicSurUnObjet);

L.polygon([
[51.509, -0.08],
[51.503, -0.06],
[51.51, -0.047]]).addTo(mymap).bindPopup("I am a polygon.").on('click',clicSurUnObjet);

var popup = L.popup();

mymap.on('click', clicAilleursSurLaCarte);

</script>
]


Comment puis récupérer la LAT avec le second exemple ou d'où vient le problème ?

Merci à vous.
Michel
#10
Miembro registrado
950 mensajes
Popularité : +53 (63 votes)
Publicado el 12,noviembre 2018 - 14:55
Bonjour,

Je viens de te faire un mini projet avec ton code,

tu trouvera un champs html rempli par la fonction "ChargeCarte", à l'initialisation de la page, les sources leaflet sont chargé dans l'ihm de la page,

et les fonctions ClicksurMarker et ClickAilleurs sont dans la page en code navigateur WL

Quand tu clic sur un marker, le champs libellé prend la valeur du clic

Lien : https://wetransfer.com/downloads/e8892eed0d0e534abcaf12cfdff8ba8620181112135312/2ffe9218ac0f5afc3309229cd206fb2e20181112135312/854f83

Jordan
#11
Publicado el 13,noviembre 2018 - 09:46
Merci Jordan pour ce code.

J'ai vu cet exemple dans la LST 113 mais semble dédié à la V23.
Je travail en V21 pour des raisons de WS et autres appli en cours d'utilisation.

Je ne vais pas vous solliciter plus que ça sur ce problème qui semble pourtant simple.
Mes compétences dans ce domaine semble vraiment limitées.

Lors de la migrations vers V23, j'appliquerai ces fonctions.

Merci encore
Michel
#12
Miembro registrado
950 mensajes
Popularité : +53 (63 votes)
Publicado el 13,noviembre 2018 - 14:48
Bonjour,

Ce n'est pas un exemple mais un projet que j'ai créer spécialement pour toi, je peux le faire pour la version 21 si tu le veux

Jordan
#13
Miembro registrado
950 mensajes
Popularité : +53 (63 votes)
Publicado el 13,noviembre 2018 - 14:49
Dans le code il n'y a aucune fonction WL propre à la version 23, il fonctionnerai même en version 18 sans problème ( avec quelque ajustement)
#14
Publicado el 13,noviembre 2018 - 15:00
Je suis preneur d'un exemple en 21.
En JS le code function n' a pas l'aire d'être pris en compte sur ma fenêtre.
Encore merci pour ta patience.
Michel
#15
Miembro registrado
950 mensajes
Popularité : +53 (63 votes)
Publicado el 13,noviembre 2018 - 16:17
Ok j'installe la 21 ce soir et je te fais ca
#16
Miembro registrado
950 mensajes
Popularité : +53 (63 votes)
Publicado el 13,noviembre 2018 - 21:14
#17
Publicado el 14,noviembre 2018 - 07:14
Bonjour Jordan,

Super, exactement ce que je cherche à faire.
Je dois reconnaître qu'avec le JS j'ai des lacunes et la façon de coder en Web ne m'est pas familière.

En complément, est-il possible d'avoir la fonctionnalité Google maps de personnalisation d'un marker ?
En Maps
Icon: "http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld="+locations[i][0]+"|FF0000|000000"

Me permettait d'afficher un nom sur le marker issu d'un champ de table sur une boucle.
En OSM, à part le vecteur, je n'ai pas trouvé l'équivalent.

Encore merci à toi pour ce service rendu.
Michel
#18
Miembro registrado
950 mensajes
Popularité : +53 (63 votes)
Publicado el 14,noviembre 2018 - 15:45
Bien sur, tu peux personnaliser comme tu veux un marqueur

var CentralIcon = L.icon({
iconUrl: 'Carte_web/centrale.png',
iconSize: [25, 25], // size of the icon
});
marker = new L.Marker(new L.latLng(data[i].lat,data[i].lng),{icon: CentralIcon});
marker.bindPopup(title).openPopup();
markersList.push(marker);


Jordan
#19
Publicado el 20,noviembre 2018 - 07:53
Bonjour Jordan,

Encore merci à toi.
En cas de besoin, sur ce type de sujet en apprentissage, pourrai-je te sollicité de nouveau sur un autre support ?

Michel
#20
Miembro registrado
950 mensajes
Popularité : +53 (63 votes)
Publicado el 20,noviembre 2018 - 16:29
Michel Fil a écrit :
Bonjour Jordan,

Encore merci à toi.
En cas de besoin, sur ce type de sujet en apprentissage, pourrai-je te sollicité de nouveau sur un autre support ?

Michel


Biensur sans problème ;)
#21
Miembro registrado
191 mensajes
Popularité : +3 (3 votes)
Publicado el 24,febrero 2020 - 12:47
Bonjour,

Possible de remettre en ligne l'exemple, j'essaie de faire de même, mais en windev mobile.

Merci d'avance

Franck
#22
Miembro registrado
1 mensaje
Publicado el 25,febrero 2020 - 18:53
Bonjour,

Je suis dans la même situation, j'aimerai bien que tu remettes ton exemple en ligne.

Merci beaucoup.
#23
Miembro registrado
950 mensajes
Popularité : +53 (63 votes)
Publicado el 25,febrero 2020 - 20:55
Bonjour,

Je viens de retrouver le projet dans mes archives,

Je l'ai mis sur le site de depot, il est en version 21

https://depot.pcsoft.fr/resource.awp…

Jordan
#24
Miembro registrado
191 mensajes
Popularité : +3 (3 votes)
Publicado el 25,febrero 2020 - 22:39
Merci Jordan
→ Volver a WEBDEV 2024