[JSP][Ergonomie] Probleme de formulaire

Version imprimable

Voir 40 message(s) de cette discussion en une page

28/02/2006, 13h11
kobe

[JSP][Ergonomie] Probleme de formulaire

Bonjour à tous!

Voilà, après avoir résolu quelques un des mes soucis, en voilà d'autres!
En effet, je dois réaliser une page jsp qui doit permettre d'afficher les enregistrements d'une table, et ensuite de pouvoir les modifier 1 à 1, d'ajouter un enregistrement ou bien en supprimer 1, le tout sur la même page...
Donc ma question est: comment réussir à agencer correctement le tout sachant que je met un bouton supprimer sur chaque ligne et qu'il y a en bas de la page un bouton pour ajouter un enregistrement supplémentaire et un autre pour valider les modifications sur les enregistrements existants... Je sais que c'est peut-être plus un problème de HTML pur mais comme ça a attrait au langage dynamique que j'utilise, voilà...

Merci d'avance pour votre aide, je sais pas si je me suis bien exprimé!

Bonne journée! :wink:
modéré par zekey : titre plus explicite
28/02/2006, 15h26
kobe

Oups :oops: Dsl pour le titre en effet!

Bon, je peux un peu plus préciser ma demande! Comme je l'ai dit, j'ai un grand formulaire qui englobe mon tableau d'afichage du résultat de ma requête! Bon, ensuite à chaque ligne, j'ai un formulaire avec un bouton supprimer pour supprimer la ligne concernée uniquement.

La suppression fonctionne, mais le fait d'englober des petits formulaires dans un plus gros rend ce dernier inactif...Résultat, mes boutons du grand formulaire ne fonctionne pas donc je n'envoie aucune donnée!

Quelqu'un aurait-il une idée pour que je contourne cette difficulté parce que là j'avoues que je ne vois pas trop... :roll:
28/02/2006, 17h13
zekey

Pourquoi 2 forms je ne vois pas l'interet
28/02/2006, 19h04
kobe

Ah bah la est toute la question! Voilà la structure actuelle de mon code:

<form modification>
<tableau>
<form suppression><ligne></ligne></form>
...
...
</tableau>
</form>
<form ajout d'enreg>
</form>
Donc voila, en gros j'ai autant de form qu'il y a d'enregistrement pour supprimer ces derniers 1 par un!

Et je ne sais vraiment pas comment m'y prendre pour structurer correctement le tout!
01/03/2006, 09h31
kobe

:( Toujours personne pour m'aider ou alors personne ne comprends mon problème? Je suis tjs bloqué là-dessus et ça serait sympa de me filer un ptit coup de pouce svp... :?
01/03/2006, 10h13
zekey

Pourquoi un form pour supprimer une ligne, c'est inutile. Un lien qui mène vers une action qui supprime la ligne est suffisant
01/03/2006, 10h14
SEMPERE Benjamin

Peut etre qu'il souhaite supprimer un ensemble de ligne (via le mechanisme de checkbox par exemple), non???
01/03/2006, 10h20
zekey

Citation:

Envoyé par SEMPERE Benjamin

Peut etre qu'il souhaite supprimer un ensemble de ligne (via le mechanisme de checkbox par exemple), non???

Ah oui en effet je n'avais pas pensé à ca.
mais dans ce cas inutile d'inclure un form dans un autre, l'un en dessous de l'autre est suffisant.
01/03/2006, 10h58
SEMPERE Benjamin
Oui tout a fait d'accord. Mais dans son exemple
Code:

1 2 3 4 5 6 7 8 9 10 <form modification> <tableau> <form suppression><ligne></ligne></form> ... ... </tableau> </form> <form ajout d'enreg> </form>
On a bien les forms l'un au dessous de l'autre.... Je suis plus trop la :wink:
01/03/2006, 11h16
zekey
Citation:
Envoyé par SEMPERE Benjamin

Oui tout a fait d'accord. Mais dans son exemple

Code:

1 2 3 4 5 6 7 8 9 10 <form modification> <tableau> <form suppression><ligne></ligne></form> ... ... </tableau> </form> <form ajout d'enreg> </form>

On a bien les forms l'un au dessous de l'autre.... Je suis plus trop la :wink:
Ben non ils sont imbriqués, moi je voulais dire :
Code:

1 2 3 4 5 6 7 8 <form suppression/modif> </form> <form ajout enregistrement> </form>
01/03/2006, 12h15
kobe

Merci pour vos réponses!
Non en effet, je ne souhaite pas supprimer une ensemble de ligne mais bien une ligne par une ligne, ce pourquoi j'ai un bouton supprimer à chaque ligne...
Par contre j'avoues que je n'ai pas trop saisie la manip pour avoir en un seul formulaire ma suppression ligne à ligne et la modification (sachant que pour la modification, le bouton doit me permettre de modifier tout le tableau) Vous n'auriez pas un lien ou un exemple pour me guider? Merci d'avance pour votre patience en tt cas!
01/03/2006, 13h08
zekey

Le bouton droit ?????
01/03/2006, 14h14
kobe

Euh, dsl mais la je comprends pas :lol:
01/03/2006, 14h21
yolepro

Et pourquoi tu ne fais pas un seul formulaire avec plusieurs boutons submit ayant différentes value ?

Comme ca dans ton action tu redispatches en fonction du bouton submit. C'est plus propre non?
01/03/2006, 14h26
kobe

Ah oui voila, je viens de voir que l'on pouvait faire ça seulement...j'espère qu'il est possible avec JSP (comme il est si évident de le faire avec PHP!) de tester la value d'un submit...bon je vais voir ça...Merci!
01/03/2006, 15h53
yolepro

Excuse moi, mais finalement, je pense que j'ai justement confondu avec PHP :oops:

Il semblerait qu'il ne soit pas possible de le faire directement en java.

par contre tu peux ajouter un champs hidden et le setter avec une fonction javascript lors du onSubmit.
01/03/2006, 16h12
kobe

Dsl je dois vraiment être idiot, mais je ne vois pas comment je dois procéder avec mes x boutons Supprimer et mon bouton Modifier...
Il faut que je mette un champ hidden avec chaque bouton Supprimer et donc à chaque submit de bouton Supprimer, je dois lancer un Javascript, c'est bien ça que tu essaye de me fare comprendre? :oops:
01/03/2006, 16h23
yolepro

Donne moi un exemple de code clair alors parce que la je comprend plus rien?
Tu a N bouton submit? ou juste un bouton submit pour supprimer, un pour modif...

Voila un bout de mon code...

Code:

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
 
<form name="action" method="post" action="admoatftpserver.jsp" onsubmit="return valider()">
<table border=1 cellpadding=1 cellspacing=0 width=600>
 
<% 
int i=0;
for (i=1;i<=columnNumber;i++) {%> 
	<th><%= rsmd.getColumnLabel(i) %></th>
 
	<%}%> 
<% int countrows = 0; 
  
  //TANT QUE LA REQUETE RENVOIE DES ENREGISTREMENTS...
   while (myresults.next()) {%>
 
    <tr height="302">
	<% for (i=1;i<=columnNumber;i++) {%> 
 		<td height="16"><input size="14" type="text" name="<%= rsmd.getColumnLabel(i) %>" value="<%= myresults.getString(i) %>"/></td>    
 
 		<% } //endfor %><td height="16"><input type="hidden" value="1" name="supp"><input type="submit" value="Supprimer"></td> 
	</tr>
 
<% countrows++;
} %> 
</table>
<p>
<%=countrows%> enregistrement(s) trouvé(s).
</center>
<form name="add" method="post" action="admoatftpserver.jsp" onsubmit="return ajouter()">
<input type="hidden" value="1" name="add">
<input type="submit" value="Ajouter un enregistrement">
</form>
<center> 
 
 
<!-- PASSAGE EN CHAMPS CACHES DU NOMBRE D'ENREGISTREMENTS ET D'UNE VARIABLE POUR SAVOIR SI LE FORMULAIRE A DEJA ETE POSTE -->
<input type="hidden" value="<%= countrows %>" name="nb_row">
<input type="hidden" value="1" name="passtwo">
<input type="submit" value="Valider">
<input type="reset" value="Annuler">
</p>
 
</form>
</center>

Donc voila, j'ai mon tableau d'affichage de résultat de requete qui est englobé dans un form pour pouvoir modifier les champs et a chaque ligne du tableau, je met en bout un bouton supprimer...

Voici la solution à ton problème (heu... si tu utilises struts):

Imaginons que tu es une table employe et que tu souhaites avoir tt les employe dans ta page avec un lien modifier et supprimer pour chaque enregistrement (je crois que c ça que tu veux... lol).

1)Tu dois deja construire un bean employe avec les getter et setter correspondant à chaque propriété de ta table.

2)Il te faut une action qui va chercher tt les enregistrements de ta table. Cette action s'appel ici employeListeAction et est décrite dans le fichier struts-config.xml par :

Code:

1
2
3
4
5
6
 
<action path="/employeListeAction"
	         type="fr.monappli.EmployeListeAction"
	         scope="request" >
<forward name="success" path="/employeliste.jsp" /> 
</action>

Voici le code de l'action employeListeAction :

Code:

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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
 
 
 
public class EmployeListeAction extends Action { 
 
	protected ArrayList getEmployes(){
		Employe employe = null;
		ArrayList employes = new ArrayList();
		Connection conn = null;
		Statement stmt = null;
		ResultSet rs = null;
 
		ServletContext context = servlet.getServletContext();
		DataSource dataSource = (DataSource)context.getAttribute(Globals.DATA_SOURCE_KEY);
 
		try{
			conn = dataSource.getConnection();
			stmt = conn.createStatement();
			rs = stmt.executeQuery("select * from employes"
			while (rs.next()){
				employe = new Employe();
 
				employe.setUserName(rs.getString("username"));
				employe.setName(rs.getString("name"));
...
...
...
				employes.add(employe);			
			}
		}catch (SQLException e){
			System.err.println(e.getMessage());
		}finally{
 
			if (rs !=null){
				try{
					rs.close();
				}catch (SQLException sqle){
					System.err.println(sqle.getMessage());
				}
				rs = null;
			}
			if (stmt !=null){
				try{
					stmt.close();
				}catch (SQLException sqle){
					System.err.println(sqle.getMessage());
				}
				stmt = null;
			}
			if (conn !=null){
				try{
					conn.close();
				}catch (SQLException sqle){
					System.err.println(sqle.getMessage());
				}
				conn = null;
			}
		}
		return employes;
	}
 
   public ActionForward execute(ActionMapping mapping,
	                               ActionForm form,
	                               HttpServletRequest request,
	                               HttpServletResponse response)
	                               throws IOException, ServletException { 
 
		//Cible par défaut en cas de succés
		String target = new String("success");
 
		ArrayList employes = null;
		employes = getEmployes();
 
		//Cible en cas d'echec
		if (employes == null){
			target = new String("login");
		}else{
			request.setAttribute("employes", employes);
			System.out.println("EmployeListeAction EMPLOYES"+request.getAttribute("employes"));
		}
 
      System.out.println("EmployeListeAction LoginAction ********** FINAL ************* execution..."); 
      System.err.println("EmployeListeAction done."); 
 
	  return (mapping.findForward(target)); 
   } 
}

3) Et enfin voici le code de la JSP te permettant d'avoir la vue sur l'action corespondante :

Code:

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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<%@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean" %>
<%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic" %>
 
<logic:notPresent name="USER">
	<logic:forward name="login" />
</logic:notPresent>
 
<html>
	<head>
	  <title><bean:message key="app.title" /></title>
	</head>
 
	<body>
 
	<table width="650" border="0" cellspacing="0" cellpadding="0">
	  <tr>
		<td colspan="7">&nbsp;</td>
	  </tr>
	  <tr bgcolor="#000000">
	    <td colspan="7" height="68" width="48%">
			<div align="left">
				<img src="images/hp_logo_eyrolles.jpg"
							width="220" height="74">
			</div>
		</td>
	  </tr>
	  <tr>
		<td colspan="7">&nbsp;</td>
	  </tr>
	</table>
 
	<html:errors />
 
	<table width="750" border="0" cellspacing="0" cellpadding="0">
		<tr align="left">
		  <th><bean:message key="app.username" /></th>
		  <th><bean:message key="app.name" /></th>
		  <th><bean:message key="app.phone" /></th>
		  <th><bean:message key="app.email" /></th>
		  <th><bean:message key="app.department" /></th>
		  <th><bean:message key="app.role" /></th>
		</tr>
		<!--iteration sur les résultat de la requete -->
		<logic:iterate id="employe" name="employes">
		<tr align="left">
			<td>
				<bean:write name="employe" property="userName" />
			</td>
			<td>
				<bean:write name="employe" property="name" />
			</td>
			<td>
				<bean:write name="employe" property="phone" />
			</td>
			<td>
				<bean:write name="employe" property="email" />
			</td>
			<td>
				<bean:write name="employe" property="department" />
			</td>
			<td>
				<bean:write name="employe" property="rolename" />
			</td>
			<td>
				<a href="edit.do?username=<bean:write name='employe' property='userName' />">Modifier</a>
				<a href="delete.do?username=<bean:write name='employe' property='userName' />">Supprimer</a>
			</td>
		</tr>
			</logic:iterate>
		<tr>
			<td colspan="7"><hr></td>
		</tr>
	</table>
	<font size="-1" face="arial">
		<a href="addemploye.jsp">Ajouter un employé</a>
	</font>
	</body>
</html>

Voir 40 message(s) de cette discussion en une page