JavaScript dans un fichier .jsp

**lisa_web** · 27/02/2013, 23h58

Bonjour,
je voudrais recuperer une variable var (String var=node.text) de mon lien et afficher sa valeur dans un div d'une autre page jsp
le lien est le suivant

Code :

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

<a class=treeview href='"+node.text+"' title=\"" + node.toolTip + "\">" + node.text+"</a>

Merci d'avance de votre aide

**arnogues** · 28/02/2013, 01h50

Je vois pas ce que vient faire le JavaScript ici, personnellement tout ça devrait être fait coté serveur.
De plus ce node.text d’où vient-il ? D'une base de donnée ? Il vient peut-être d'un objet avec un id ?

Personnellement j'aurai fais :

Code html :

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

<a class="treeview href="?nodeid=' + node.id + '"....></a>

Et dans l'autre page tu récupères ce paramètres "nodeid".

**lisa_web** · 28/02/2013, 12h01

Bonjour arnogues, en fait node.text contient un nom de colonne de ma base de donnée. le lien est dans un boucle for qui affiche les noms de colonne sous forme de treeview.

Code :

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

<a class=treeview href='"+node.text+"' title=\"" + node.toolTip + "\">" + node.text+"</a>

Donc mon probleme c'est d'afficher au click sur un nom de colonne la valeur de node.text dans une partie de la page. le code que j'ai est long mais si vous voulez je peux le poster

**n2engineer5** · 28/02/2013, 15h12

postes le code. j'ai relu plusieurs fois et je ne pige pas vraiment ce que tu veux.

**lisa_web** · 01/03/2013, 01h45

Bonjour n2engineer5, je m'explique encore je veux recuperer la valeur de node.text (voir treeview.jsp en bas) quand je clik sur le lien et l'afficher dans une partie de ma page index.jsp (qui se charge de l'affichage) voici le code
une page treeview.jsp
une page index.jsp qui fait l'affichage

Code jsp :

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
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page import="java.util.List,java.util.ArrayList" %>
 
 
<%@include file="treeview.jsp" %>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
 
 
 
<%
 
 
String folder = request.getParameter("f");      
if (folder==null){
        folder="images";
}
 
TreeView tv =new TreeView();
 
tv.target="content";
tv.setImagesUrl(folder);
 
//add treenode using the standard methods               
tv.add(tv.createNode("LESELEVES"));
 
List<String> list =
(ArrayList<String>)request.getAttribute("list");
for(int i = 0; i < list.size();i++){
//affichage des colonnes sous forme de treeview
        tv.nodes.item(0).add(tv.createNode(list.get(i),"toto",list.get(i)));
}
 
 
                out.print(tv.getTree());
        
%>
<h2>zone de recup</h2>
 
</body>
</html>

et une page treview.jsp

Code jsp :

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
class TreeView{
	System.out.println("nombre de nodeList"+nodeList.length);
	for (int i=0;i<nodeList.length;i++){
		Node node = nodeList.item(i);	
		if(node.childNodes.length>0){
			System.out.println("nombre de childnode"+nodeList.length);
			hasChild=true;	
		}else{
			hasChild=false;
		}
		if(node.imageUrl==""){
			style="";
		}else{
			style="style='list-style-image: url("+ node.imageUrl +");'";
		}				
		if(hasChild){
			print("<li "+ style +" class=folder id='P" + parent + i + "'><a class=treeview href=\"javascript:toggle('N" + parent + "_" + i + "','P" + parent + i + "')\">" + node.text + "</a>");
		}else{
			if(node.target==""){
				node.target=target;
			}
		// c'est avec ce lien que je dois recuperer la valeur de node.text au click et l'afficher dans index.jsp
		//toto est l'url pattern declaré dans web.xml
			print("<li "+ style +" class=file><a class=treeview href='"+"toto' title=\"" + node.toolTip + "\">" + node.text+"</a>");
		}
		System.out.println("nom de la colonne"+node.text);
		if(hasChild){		
			loopThru(node.childNodes,parent + "_" + i);
		}	
		print("</li>");
	}
}

**sekaijin** · 01/03/2013, 07h34

excuse mais édite ton message précédent
enlève l'espace entre [code et =jsp] pour que le forum afiche ton code correctement

indente ton code et mets nous uniquemet que la boucle où tu génére ton href qui te pose pb car là il y en a beaucoup trop c'est quasi illisible et on ne sais pas ce qu'on cherche.

Je t'ai fait une réponse et en relisant je me suis dit que je n'avais pas compris

Code jsp :

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

<a class=treeview href=\"url/de/la/page/avec/un/div/qui/doit/recevoir/la/valeur.de?node.text="+node.text+"\" title=\"" + node.toolTip + "\">" + node.text+"</a>

ainsi la jsp "valeur.de" reçois dans sa queryString la variable node.text contenant du lien cliqué
A+JYT

**lisa_web** · 01/03/2013, 11h05

Bonjour sekaijin, j'ai édité le code , en fait je pense que vous n'avez pas compris ma question et je me suis reexpliqué en haut

Invité · 01/03/2013, 13h43

Bonjour,
Le problème est que tu n'obtiens rien avec ce fichier là ? ou en général tu ne parviens pas à faire passer de variable ?

**sekaijin** · 01/03/2013, 18h39

je ne suis pas sur d'avoir compris
je pense que tu as un pb d'ordre d'exécution de test jsp

lorsque le client appelle ton url index.jsp
le code de celle-ci commence à s'exécuter puis vient l'instruction include treeview.jsp
là c'est le code de tree view qui est exécuté
cette jsp rand la main à index.jsp qui génère le HTML
celui-ci est lu par le client qui instancie le DOM et exécute le js

lorsque l'utilisateur clique sur le lien le code index.jsp à déjà été exécuté tu ne peux donc rien lui passer.

Je n'ai pas compris ce que tu veux faire
si c'est envoyer la variable à index.jsp et recharger cette page
je t'ai déjà donné la solution

Code jsp :

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

<a class=treeview href=\"index.jsp?uneVariable="+node.text+"\" title=\"" + node.toolTip + "\">" + node.text+"</a>

il te reste juste dans index.jsp à récupérer la queryString (uneVariable) sera définie dedans et contiendra la valeur du lien cliqué.

si par contre tu ne veux pas ré exécuter la jsp index.jsp mais aller directement placer la valeur dans le DOM
(je n'ai pas compris où)
on n'a pas besoint du jsp mais du code HTML de ta page.

Code jsp :

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

<a class=treeview href=\"#\" onclick="return nodeClick(this);>" + node.text+"</a>

Code :

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

1
2
3
4
5
6
function nodeClick(aHref) {
  var text = aHref.innerHtml;
  var p = document.createElement('P');
  p.innerHtml = text;
  document.body.appendChild(p);
}

Ainsi lorsque tu clique sur le lien la fonction nodeClick est appelée avec en paramètre le lien sur le quel tu as cliqué. la fonction récupère le texte du lien
crée un nouveau paragraphe
écrit le texte récupéré dans le paragraphe
et ajoute le paragraphe dans la page.
dans ce cas rien n'est envoyé au serveur aucun code jsp n'est réexécuté tout se passe en local sur le poste du client

A+JYT

**lisa_web** · 03/03/2013, 16h59

Bonjour sekaijin, merci pour ton aide.
en fait c'est la deuxieme solution qui m'interesse. donc j'ai mi la fonction nodeClick dans la page treeview.jsp et j'ai appelé la fonction au click . Apres execution quand je clique sur le lien ca reste sur la meme page mais ca n'affiche toujours pas le lien sur la meme page.

**lisa_web** · 03/03/2013, 17h15

En fait c'est le script qui n'est pas executé je crois parce j'ai essayé avec un simple fonction javascript qui affiche juste une boite de dialogue au clik, je precise que je suis une novice en javascript; donc peut etre que j'ai mal appelé la fonction.

**sekaijin** · 03/03/2013, 18h36

poste la partie de code HTML (dans ton navigateur) du lien AHref avec la fonction

A+JYT

**lisa_web** · 03/03/2013, 22h04

Bonjour sekaijin, comme expliqué en haut le lien se trouve dans une page jsp qui se charge d'afficher les resultats sous forme de treeview.

Code html :

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

print("<li class=file><a class=treeview href=\"#\" onclick=\"return nodeClick(this);\">" + node.text+"</a>");

Cette page est appelé dans un autre fichier jsp , ce jsp contient le code HTML.
En fait je travail avec le MVC,
La page qui contient le code HTML est la suivante:

Code html :

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
 
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page import="java.util.List,java.util.ArrayList" %>
 
 
<%@include file="treeview.jsp" %>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
 
<%
 
 
String folder = request.getParameter("f");      
if (folder==null){
        folder="images";
}
 
TreeView tv =new TreeView();
 
tv.target="content";
tv.setImagesUrl(folder);
 
                
tv.add(tv.createNode("LESELEVES"));
 
List<String> list =
(ArrayList<String>)request.getAttribute("list");
//recuperation des colonnes de ma table
for(int i = 0; i < list.size();i++){
        tv.nodes.item(0).add(tv.createNode(list.get(i),"toto",list.get(i)));
 
}
 
//affichage de la liste
                out.print(tv.getTree());
                
        
%>
<h2>zone de recuperation</h2>
 
 
</body>
</html>

**lisa_web** · 03/03/2013, 22h25

bout de code de treeview.jsp qui contient la fonction nodeClick

Code java :

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

1
2
3
4
5
6
7
8
public String getTree(){
		print("<script>function toggle(id,p){var myChild = document.getElementById(id);if(myChild.style.display!='block'){myChild.style.display='block';document.getElementById(p).className='folderOpen';}else{myChild.style.display='none';document.getElementById(p).className='folder';}}</script>");
		print("<style>ul.tree{display:none;margin-left:17px;}li.folder{list-style-image: url("+ folder +"/plus.gif);}li.folderOpen{list-style-image: url("+ folder +"/minus.gif);}li.file{list-style-image: url("+ folder +"/dot.gif);}a.treeview{color:"+ color +";font-family:verdana;font-size:8pt;}a.treeview:link {text-decoration:none;}a.treeview:visited{text-decoration:none;}a.treeview:hover {text-decoration:underline;}</style>");
		print("<script>function nodeClick (aHref){ var text=aHerf.innerHTML; var p=document.createElement('P'); p.innerHtml = text; document.body.appendChild (p);}s</script>");
 
		loopThru(nodes,"0");
		return buf.toString();
	}

**sekaijin** · 04/03/2013, 20h13

Non se dont nous avons besoin c'est le code HTML DANS LE NAVIGATEUR

le code côté serveur ne sert à rien javascript s'exécute EXCLUSIVEMENT DANS LE NAVIGATEUR

A+JYT

**lisa_web** · 05/03/2013, 20h10

Merci, sekaijin,
j'ai resolue le probleme et si ca peut aider un autre voici ce que j'ai fait

Code javascript :

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

1
2
 
<script>function test (id){if(id) { image = id; } else { image ='erreur d'affichage'; } document.getElementById ('ecrit').innerHTML=image;}</script>

Code HTML :

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

1
2
3
 
<a class=treeview href=\"#\" title=\"" + node.toolTip + "\"  onClick=\"javascript:test('"+node.text+  "')\">" + node.text+"</a><br>
<span  id='ecrit'></span>

**sekaijin** · 05/03/2013, 20h29

Envoyé par lisa_web

Merci, sekaijin,
j'ai resolue le probleme et si ca peut aider un autre voici ce que j'ai fait

Code javascript :

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

1
2
 
<script>function test (id){if(id) { image = id; } else { image ='erreur d'affichage'; } document.getElementById ('ecrit').innerHTML=image;}</script>

cette fonction va te poser plusieurs problèmes
1) la syntaxe de l'affectation de l'erreur est incorrecte si tu passe dans le elle tu va avoir une exception
2) il faut retourner un booléen true ou false (dans ton cas false)

Code javascript :

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

1
2
3
4
5
6
7
8
9
10
function test (id){
  if(id) {
    image = id;
  } else {
    //image ='erreur d'affichage'; //ici tu ne peux pas avoir de ' dans une chaine délimité par des ' il faut utiliser des "
    image ="erreur d'affichage"; //ici pas de pb de string
  }
  document.getElementById ('ecrit').innerHTML=image;
  return false; //il faut retourner false l'explication dans la partie suivante
}

Code HTML :

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

1
2
3
 
<a class=treeview href="#" title="blabla"  onclick="return test('node') ">node</a><br>
<span  id='ecrit'></span>

1) onclick s'écrit sans majuscule.
2) il ne faut pas mettre javascript: dans les methodes des événements.
3) il faut retourner false dans onclik. si tu ne le fait pas ton lien est activé. tu à mis # donc si ton lien est en bas de la page lorsqu'on clique on remonte tout en haut

A+JYT

**lisa_web** · 07/03/2013, 13h59

Merci, sekaijin jai rectifié la fonction et l'appel

JavaScript dans un fichier .jsp

JavaScript

Discussions similaires

Partager

Partager