Discussion :

[Zombee]

Bonjour,

Avant de poser ma question laissez moi vous présenter mon travail,
J'ai une JSP qui à l'aide d'une classe java récupère des données depuis une base de donnée. Ces données doivent me permettre de créer des marqueurs sur une Google Map créée grâce à des fichiers javascripts séparés.

Je souhaite savoir si il est possible de passer les données récupérés dans ma jsp à un fichier javascript ?

Ou doit-je créer le code javascript dans ma jsp en fonction de ce que je récupère ?

J'espère avoir été clair, sinon dite le moi.

Merci

[Carhiboux]

Hum. Je pense que tu n'a pas totalement saisi ce que fait JSP ou ce que fait Javascript.

JSP, en très gros, les experts me pardonneront ce raccourci rapide, génère du HTML en y incluant des données.

Et le Javascript, qu'il soit dans un fichier à part ou dans le fichier .html (ou dans ton cas .jsp) est exécuté lorsque la page est chargé.

Que le code soit dans un fichier séparé et inclus via la balise <script> ou écrit directement dans le fichier via la balise <script> encore elle!

Maintenant, je dirais qu'au niveau bonne pratique, il est bon de mettre son javascript dans un fichier séparé.

D'autant que JSP est déjà assez touffu comme cela.

Et oui, tu peux passer des variables via JSP à javascript, par exemple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

alert("<%=var%>");

[Jimmy_]

Ou doit-je créer le code javascript dans ma jsp en fonction de ce que je récupère ?

Oui c'est ça qu'il faut faire, car la jsp est executé bien avant le code javascript.
Dans ton architecture il faut bien faire générer le javascript par le code JSP.

[Zombee]

Tout d'abord merci pour ces clarifications!

Mais j'ai malencontreusement un dernier 'problème'.

Sur la même jsp je dois remplir un champ avec une date, qui me servira pour ma requête sql. Je ne sais pas comment passer le contenu du champ à la classe java et recharger la page avec le résultat de la requête sql.

J'espère avoir été clair.

Merci

[OButterlin]

Histoire de clarifier les choses...

La page JSP est exécutée sur le serveur d'application et renvoie une page HTML au navigateur qui en a fait la demande.
Le code JavaScript s'exécute sur le navigateur.

Ceci dit, je ne sais pas exactement ce que tu veux faire, si tu pouvais clarifier la demande, on pourrait t'aiguiller plus facilement.
Pour ta dernière question, pour accéder au contenu d'un champ <input> de ta page via JavaScript, c'est assez simple et tu as le choix :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
var contenu = document.forms[0].nomVariable.value; // la donnée est dans le premier formulaire de la page
 
var contenu = document.MonFormulaire.nomVariable.value; // la donnée est dans un formulaire nommé "MonFormulaire"
 
var contenu = $(":input:[name='nomVariable']").val(); // en utilisant JQuery

[Zombee]

Dans une jsp j'ai un champ tel que :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<p>Sélectionner une date: <input type="text" id="DatePicker" name="datePicker"/></p>
	<input type="Submit" name="button" value="Rechercher"/>

Ce champ sera rempli avec une date (du genre JJ/MM/AA).

J'aimerai appeler la fonction Java suivante avec la date en argument

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<% ArrayList<String> ListeMarqueur =  new ArrayList<String>(ControleurMap.liste(LaDateDuChamp));
for (String place : ListeMarqueur){ %>

Est ce possible sans avoir à utiliser une servlet ?
Si oui comment ?

[OButterlin]

Que veux-tu dire par appeler une fonction java ?
C'est forcément lié à une servlet, directement ou indirectement (pour les framework comme struts)...

Peux-tu préciser ce que tu cherches à faire ?

[Zombee]

J'ai récupéré un projet déjà existant dans lequel il y a des classes java et des jsp.

Les jsp appel directement le fonction java de cette manière :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<%@page import="model.Clients"%>
<%@page import="controleur.ControleurClients"%>
<%@page import="controleur.ControleurUtilisateur"%>
<%@page import="java.util.ArrayList"%>
 
<%
boolean error=false;
ArrayList<Clients> Coll_cli = new ArrayList<Clients>(ControleurClients.liste());
 
if (Coll_cli.isEmpty()) {
        error=true;
}
%>
....

Je souhaitais donc rester dans cet esprit.

[OButterlin]

Tu appelles la page JSP par un formulaire ou par un lien ?
Dans le premier cas, si tu as un champ <input> qui correspond à la date la valeur sera transmise à la page appelée.
Si c'est par un lien, il faudra passer par une méthode javascript et construire l'URL en ajoutant la date ("?nomParametre=" + valeur).

Du côté de ta page JSP appelée, il suffit de faire un truc comme ça

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
...
<%
String dateString = request.getParameter("nomParametre");
 
// Si tu dois passer un objet Date à une classe java, tu peux convertir via SimpleDateFormat
 
%>
...

[Zombee]

Voici grosso modo la jsp :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ page pageEncoding="UTF-8"%>
<%@page import="controleur.ControleurMap"%>
<%@page import="java.util.ArrayList"%>
 
<!-- Script pour la google map -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
<script src="/Splitter/gmaps.js"></script>
<script src="/Splitter/core.js"></script>
 
<!-- Script pour le datePicker -->
<script src="jquery-1.6.2.min.js"></script>
<script src="jquery-ui-1.8.15.custom.min.js"></script>
<link rel="stylesheet" href="jquery/jqueryCalendar.css">
<script>
                jQuery(function() {
                                jQuery( "#DatePicker" ).datepicker();
                });
</script>
 
<!-- Champ à remplir avec une date -->
<form>
	<p>Sélectionner une date: <input type="text" id="DatePicker" name="datePicker"/></p>
	<input type="Submit" name="button" value="Rechercher"/>
</form>
 
<!-- Appel de la fonction avec la date en parametre -->
<%
boolean error=false;
ArrayList<String> ListeMarqueur =  new ArrayList<String>(ControleurMap.liste(datePicker));
for (String place : ListeMarqueur){ %>
 
<!-- Utilisation de la réponse de la requete sql pour créer les marqueurs -->
<script>
var place =  <%= place.replaceAll("\\s", "+" )%>;
geocoder = new GClientGeocoder();
geocoder.getLatLng(place, function(point) {
    if (!point) {
        alert(place + " not found");
    } else {
        var info = "<h3>"+place+"</h3>Latitude: "+point.y+"  Longitude:"+point.x;
        var marker = new GMarker(point);
        map.addOverlay(marker);
        marker.openInfoWindowHtml(info);
    }
});
</script>
<%} %>
 
<!-- Div contenant la map google -->
<div id="basic_map" class="map"></div>

[OButterlin]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
...
<% boolean error=false;
String datePicker = request.getParameter("datePicker");
// Eventuellement, prévoir une conversion de la date String en objet Date via SimpleDateFormat...

ArrayList<String> ListeMarqueur =  new ArrayList<String>(ControleurMap.liste(datePicker));
...

[Zombee]

Re bonjour, après plusieurs jours de travail, me voici face à un nouveau problème,

je souhaite utiliser un tableau :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<% ArrayList<String> listeMarqueur = new ArrayList<String>(package.liste(datePicker)); %>

pour afficher des marqueurs sur ma google map.

J'ai trouver un example de code permettant de le faire mais uniquement à l'aide d'un champ html (avec pour label address)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
GMaps.geocode({
	  address: $('#address').val(),
	  callback: function(results, status) {
	    if (status == 'OK') {
	      var latlng = results[0].geometry.location;
	      map.setCenter(latlng.lat(), latlng.lng());
	      map.addMarker({
	        lat: latlng.lat(),
	        lng: latlng.lng()
	      });
	    }
	  }
	});

Comme je suis toujours aussi mauvais en javascript, je viens vous solliciter
pour savoir comment je peux faire.

merci.

[OButterlin]

ça parait normal puisque c'est une fonction ajax...
mais où est ton problème au juste, récupérer via jQuery la valeur du champ <input> ?
Si c'est ça, tu fais simplement

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
$(":input:[name='nomChamp']).val();

Sinon, précise le problème