[XHTML][JSP] Comment rendre ce forumaire valide ?

Comment rendre ce forumaire valide ? [XHTML][JSP] - HTML/CSS - Programmation

Marsh Posté le 27-02-2005 à 21:07:08    

C un site de ecommerce simplifié, pour un projet de fin d'année...
j'ai besoin pour chaque ligne de pouvoir supprimer une quantité voulue par l'utilisateur...
 
g d'ailleurs le meme problème pour ajouter des éléments au panier...
 
en l'état actuel ca fonctionne, mais c pas valide...
 
si je monte le form avant le table, chaque fois que j'appuis sur un bouton, c tjs la valeur du premier champs qui est prise en compte...mais le code est bien valide...
 
 
Ex :  
 
Carotte  -  1   -   Ajouter
Cerises   -  4   -  Ajouter
 
si je veux ajouter 4 cerises, en montant le form, ca m'en ajoutera qu'une...alors que mon code pas valide m'ajoute bien les 4 cerises...

Code :
  1. <div id="centre">
  3. <table>
  4. <tr>
  5. <th>Libellé</th><th>Prix Unitaire</th><th>Quantité</th><th>Qté à retirer</th>
  6. <th></th><th>Montant</th>
  7. </tr>
  8. <%Iterator i = panier.iterator();
  9. double montantTotal = 0;
  10. while (i.hasNext()) {
  11. ElementPanier ep = (ElementPanier) i.next();
  12. InfosArticle infoArt = ep.getInfosArticle();%>
  14. <tr>
  15.  <form action="Controlleur" method="post">
  16.  <td><%=infoArt.getLibelle()%></td>
  17.  <td><%=infoArt.getPrixUnitaire()%>€</td>
  18.  <td><%=ep.getQuantite()%></td>
  19.  <td><input size="2" value="1" name="quantite"></input> <input
  20.   type="hidden" name="action" value="supprimerArticle"></input> <input
  21.   type="hidden" name="IdArticle" value="<%=infoArt.getIdArticle()%>"></input>
  22.  </td><td>
  23.  <input type="submit" value="supprimer" name="submit" /></td>
  24.  <td><%=infoArt.getPrixUnitaire() * ep.getQuantite()%>€</td>
  25.  </form>
  26. </tr>
  28. <%
  29. montantTotal = montantTotal + (infoArt.getPrixUnitaire() * ep.getQuantite());
  30. }%>
  31. <tr><td></td><td></td><td></td><td></td><td></td><td id="resultat"><%=montantTotal%>€</td>
  32. </table>
  33. </div>


Message édité par Jubijub le 27-02-2005 à 21:07:55

---------------
Jubi Photos : Flickr - 500px
Reply

Marsh Posté le 27-02-2005 à 21:07:08   

Reply

Marsh Posté le 27-02-2005 à 21:11:28    

Aie mais c'est du n'importee quoi tout ces <td></td> !!
Bon, le <table> tout de suite dans le div, ca sert a rien.
Le form faut le mettre en dehors du table.  
La balise input est orpheline => <input ..... /> et non pas <input></input> (tu l'as fait parfois mais pas toujours).
 
C'est ce que je vois a premiere vue


---------------
Si la vérité est découverte par quelqu'un d'autre,elle perd toujours un peu d'attrait
Reply

Marsh Posté le 27-02-2005 à 21:14:14    

les td /td c pour décaler la cellule du total...mais c vrai qu'un seul avec un colspan irait aussi bien :D
 
sinon le div me sert pour le layout général de ma page, c mon div central...g un header, un menu, le central, et un footer...donc ca c pas le pb...
 
et si je fous le form en dehors de la table, g le problème énoncé : le form s'envoit avec l'info contenue dans le champs de la première ligne...vu la forme, un tableau c qd meme pratique pour le mettre en forme (avec des spans je v trop me faire chier pour les aligner...


Message édité par Jubijub le 27-02-2005 à 21:15:00

---------------
Jubi Photos : Flickr - 500px
Reply

Marsh Posté le 27-02-2005 à 21:16:48    

personnelement les td sont juste...
ce sont des donnée tabulaires...


---------------
Nos estans firs di nosse pitite patreye...
Reply

Marsh Posté le 27-02-2005 à 21:17:22    

Non non en l'occurance le tableau est une bonne idée etant donné que c'est des données assez tabulaires :D. Parcontre ton truc des td/tr pour alligner ... ca l'est moins ... tu pourrais limite faire des colspan/rowspan ... meme si je pense qu'on peut trouver plus simple ... y a moyen que tu nous file un lien vers une page "concrete" pour qu'on regarde en clair ce que ca fait ? Parceque meme si c'etait du php j'aurais de la peine a voir exactement vu comment c'est enmèlé avec l'html... et vu qu'en plus c'est du java et que ca fait un moment que j'en ai plus fait :D


---------------
Si la vérité est découverte par quelqu'un d'autre,elle perd toujours un peu d'attrait
Reply

Marsh Posté le 27-02-2005 à 21:17:39    

sauf le td de fin, faut utiliser colspan


---------------
Nos estans firs di nosse pitite patreye...
Reply

Marsh Posté le 27-02-2005 à 21:20:49    

c du JSP, et g pas de servir que je puisse publier sur le web...
 
la JSP

Code :
  1. <?xml version="1.0" encoding="ISO-8859-1" ?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <%@ page
  6. language="java"
  7. contentType="text/html; charset=ISO-8859-1"
  8. pageEncoding="ISO-8859-1"
  9. import = "com.jubijub.ecommerce.ejb.*"
  10. import = "java.util.*"
  11. %>
  12. <jsp:useBean id="panier" scope="request" class="java.util.ArrayList" />
  13. <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
  14. <meta name="GENERATOR" content="IBM WebSphere Studio" />
  15. <meta http-equiv="Content-Style-Type" content="text/css" />
  16. <link href="theme/base.css" rel="stylesheet" type="text/css" />
  17. <title>Mon Panier</title>
  18. </head>
  19. <body>
  20. <div id="conteneur"><%@ include file="menu.jsp"%>
  21. <div id="login">test</div>
  23. <div id="centre">
  25. <table>
  26. <tr>
  27. <th>Libellé</th><th>Prix Unitaire</th><th>Quantité</th><th>Qté à retirer</th>
  28. <th></th><th>Montant</th>
  29. </tr>
  31. <%Iterator i = panier.iterator();
  32. double montantTotal = 0;
  33. while (i.hasNext()) {
  34. ElementPanier ep = (ElementPanier) i.next();
  35. InfosArticle infoArt = ep.getInfosArticle();%>
  37. <tr>
  38. <form action="Controlleur" method="post">
  39.  <td><%=infoArt.getLibelle()%></td>
  40.  <td><%=infoArt.getPrixUnitaire()%>€</td>
  41.  <td><%=ep.getQuantite()%></td>
  42.  <td>
  43.   <input size="2" value="1" name="quantite"/>
  44.   <input type="hidden" name="action" value="supprimerArticle"/>
  45.   <input type="hidden" name="IdArticle" value="<%=infoArt.getIdArticle()%>"/>
  46.  </td>
  47.  <td>
  48.  <input type="submit" value="supprimer" name="submit" />
  49.  </td>
  50.  <td><%=infoArt.getPrixUnitaire() * ep.getQuantite()%>€</td>
  51. </form>
  52. </tr>
  53. <%
  54. montantTotal = montantTotal + (infoArt.getPrixUnitaire() * ep.getQuantite());
  55. }%>
  57. <tr><td  colspan="5"></td><td id="resultat"><%=montantTotal%>€</td>
  58. </table>
  59. </div>
  62. <div id="pied">
  63. <p>&copy; Master IID-SIA 2005</p>
  64. </div>
  65. </div>
  66. </body>
  67. </html>


 
et le html qu'elle génère :  
 

Code :
  1. <?xml version="1.0" encoding="ISO-8859-1" ?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  7. <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
  8. <meta name="GENERATOR" content="IBM WebSphere Studio" />
  9. <meta http-equiv="Content-Style-Type" content="text/css" />
  10. <link href="theme/base.css" rel="stylesheet" type="text/css" />
  11. <title>Mon Panier</title>
  12. </head>
  13. <body>
  14. <div id="conteneur"><div id="header">
  15. <img src="images/banner.png" alt="Banière du site"/>
  16. </div>
  18. <div id="gauche">
  19. <ul class="menugauche">
  20. <li><a href="Controlleur?action=listeCategorie">Les articles</a></li>
  21. <li><a href="Controlleur?action=listeCategorie">Mon panier</a></li>
  22. <li><a href="Controlleur?action=listeCategorie">Mes commandes</a></li>
  23. <li><a href="Controlleur?action=listeCategorie">M'authentifier</a></li>
  24. </ul>
  26. </div>
  27. <div id="login">test</div>
  29. <div id="centre">
  31. <table>
  32. <tr>
  33. <th>Libellé</th><th>Prix Unitaire</th><th>Quantité</th><th>Qté à retirer</th>
  34. <th></th><th>Montant</th></tr>
  36. <tr>
  38.  <form action="Controlleur" method="post">
  39.  <td>Carottes</td>
  40.  <td>2.5€</td>
  41.  <td>1</td>
  42.  <td><input size="2" value="1" name="quantite"></input> <input
  43.   type="hidden" name="action" value="supprimerArticle"></input> <input
  44.   type="hidden" name="IdArticle" value="1"></input>
  45.  </td><td>
  47.  <input type="submit" value="supprimer" name="submit" /></td>
  48.  <td>2.5€</td>
  49.  </form>
  50. </tr>
  53. <tr><td></td><td></td><td></td><td></td><td></td><td id="resultat">2.5€</td>
  54. </table>
  55. </div>
  58. <div id="pied">
  60. <p>&copy; Master IID-SIA 2005</p>
  61. </div>
  62. </div>
  63. </body>
  64. </html>


Message édité par Jubijub le 27-02-2005 à 21:28:55

---------------
Jubi Photos : Flickr - 500px
Reply

Marsh Posté le 27-02-2005 à 21:22:10    

PS : g corrigé le colspan sur la nouvelle version
 
(on ne se moque pas du design, je suis nul en webdesign :) )
http://jubijub.free.fr/images/demo.png
 
mon pb est donc le suivant : là g 4 jeans, et 1 carrotes...si je veux supprimer 2 jeans par ex, ca me supprimera en fait 1 carotte (ca prend ce qui se trouve sur la première ligne)


Message édité par Jubijub le 27-02-2005 à 21:26:26

---------------
Jubi Photos : Flickr - 500px
Reply

Marsh Posté le 27-02-2005 à 21:23:32    

tu as encore des </input> :o


---------------
Nos estans firs di nosse pitite patreye...
Reply

Marsh Posté le 27-02-2005 à 21:30:11    

A oui biensur, j'avais pas vu le while avant *honte a moi*, c'est donc normal que si tu met le <form> avant le <table> c'est 1 seul champ qui sera retourné (a moins que tu envoie le tout avec un name="monnom[]" ) ce qui complique le tout ... Vire les </input> et fait un colspan pour le dernier et ca devrait etre bon


---------------
Si la vérité est découverte par quelqu'un d'autre,elle perd toujours un peu d'attrait
Reply

Marsh Posté le 27-02-2005 à 21:30:11   

Reply

Marsh Posté le 27-02-2005 à 21:34:00    

pour ton erreur de delete, verifie l'id dans le champs hidden...


---------------
Nos estans firs di nosse pitite patreye...
Reply

Marsh Posté le 27-02-2005 à 21:36:47    

c pas valide à cause de la position du form...visiblement on peut pas mettre un form dans un <td>, ni dans aucun élément fils de table, table inclu...
 
le truc marche parfaitement tel que posté...il est juste pas valide...si je le rend valide, il ne fonctionne plus...c mon dilème


---------------
Jubi Photos : Flickr - 500px
Reply

Marsh Posté le 27-02-2005 à 21:41:08    

T'a essayé de le mettre dans le <td> ?


---------------
Si la vérité est découverte par quelqu'un d'autre,elle perd toujours un peu d'attrait
Reply

Marsh Posté le 27-02-2005 à 21:43:30    

et mettre le <tr> dans le <form> ca donne quoi ?


---------------
Nos estans firs di nosse pitite patreye...
Reply

Marsh Posté le 27-02-2005 à 21:49:41    

ca foire : le form veut pas etre dans un table :D
 
--> esox_ch : si je le met dans le td ca peut pas etre valide, parce que si je respecte le xml, je suis obigé de le fermer dans le td aussi...
 
c insoluble en fait je pense...parce que sans faire un form par ligne, y'a aucune solution pour savoir en face de quelle ligne le valider a été demandé...
 
ou alors :  
 
je fais que le nom de chaque champs soit un truc genre champs + n, avec n qui s'incrémente à chaque ligne...
 
et je fous un champs hidden pour chaque bouton, qui vaut lui aussi n
 
de sorte que dans la servlet, je teste la valeur hidden, et je récupère le champs correspondant qui s'appellera donc champsn
 
c lourdingue :(


---------------
Jubi Photos : Flickr - 500px
Reply

Marsh Posté le 27-02-2005 à 21:56:23    

Qu'est ce qui t'empeche de fermer le form dans le td ? En modifiant un peu on obtiens :  
 

Code :
  1. <tr>
  3.        
  4.          <td>Carottes</td>
  5.          <td>2.5€</td>
  6.          <td>1</td>
  7.          <td><form action="Controlleur" method="post"><input size="2" value="1" name="quantite"></input> <input
  8.              type="hidden" name="action" value="supprimerArticle" /> <input
  9.              type="hidden" name="IdArticle" value="1" />
  10. <input type="submit" value="supprimer" name="submit" />
  11.   </form>
  12.          </td><td>
  13.         </td>
  14.          <td>2.5€</td>
  15.      
  16.      </tr>


 
Il suffi de mettre un peu d'ordre dans les tr /td et ca devrait etre bon d'apres moi  :heink:


---------------
Si la vérité est découverte par quelqu'un d'autre,elle perd toujours un peu d'attrait
Reply

Marsh Posté le 27-02-2005 à 22:00:57    

ca bousille tt ma présentation ...ca va coller le champs et le bouton pour le soumettre...
 
je me prend ca en validant ton code :  
 

Code :
  1. * Line 21, character 43:
  3. ... 2" value="1" name="quantite"/>
  4.                                  ^
  6.       Error: element input not allowed here; possible cause is an inline element containing a block-level element
  7.     * Line 22, character 61:
  9. ... on" value="supprimerArticle"/> <input type="hidden" name="Id ...
  10.                                  ^
  12.       Error: element input not allowed here; possible cause is an inline element containing a block-level element
  13.     * Line 22, character 112:
  15. ...  name="IdArticle" value="1" />
  16.                                  ^
  18.       Error: element input not allowed here; possible cause is an inline element containing a block-level element
  19.     * Line 23, character 55:
  21. ... e="supprimer" name="submit" />
  22.                                  ^
  24.       Error: element input not allowed here; possible cause is an inline element containing a block-level element


---------------
Jubi Photos : Flickr - 500px
Reply

Marsh Posté le 27-02-2005 à 22:04:17    

faut jouer avec le css...
 
form { dipslay:inline;}


---------------
Nos estans firs di nosse pitite patreye...
Reply

Marsh Posté le 27-02-2005 à 22:05:46    

Quand tu sors le form, est ce que tu penses à sortir aussi le </form>?
Sur la future version de mon site, ca marche trés bien avec les <form> en dehors des <table>. Je peux même le faire avec le <form> autour de plusieurs <table> contenant chacun des <input/> dans les <td>.
 
Au fait, si tu met le même nom à plusieurs input d'un même form, c'est normal que ca marche pas des masses. Quand tu met tes <form> entre <tr> et <tr/>, t'en a un par ligne mais quand tu le mets autour du <table> t'en as plus qu'un en tout. Voilà pourquoi ca marche pas quand c'est en dehors du table.
Si tu met dans un et un seul <td> tous les <input> dont t'as besoin pour suprimer l'article, tu pouras y mettre aussi le <form> de l'article et ca sera normalement xhtml compliant.
 
Au fait, avec ton systéme actuel, tu comptes faire comment pour mettre à jour le nombre d'article? T'avais prévus de mettre un <form> autour des autres <form>? Je suis pas sur que ca soit un bon systéme.
 
EDIT : C'est sur, un form ne peut pas être ouvert dans un <td> et fermé dans un autre vu que le chevauchement de balise est interdit par la norme xml.


Message édité par omega2 le 27-02-2005 à 22:07:41
Reply

Marsh Posté le 27-02-2005 à 22:07:46    

Là tu ouvres et fermes ton form dans ton while non ?
Tu devrais l'ouvrir avant et le fermer après...

Reply

Marsh Posté le 27-02-2005 à 22:10:39    

Bah... sinon tu fais autant de tableaux que de formulaires :
 
<table> Un tableau pour les en-têtes</table>
<form>
  <table> Ton premier produit </table>
</form>
<form>
  <table> Ton deuxième produit </table>
</form>
 
 
etc...


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
Reply

Marsh Posté le 27-02-2005 à 23:11:09    

-->GM : non , parce que les tables sont carrément plus alignées (ce qui les aligne c la taille du TH, que je peux mettre qu'1x)
 
-->@ tous : à mon avis omega est sur la voie...comme je l'ai posté plus haut, la seule façon de m'en sortir, c de faire que mes champs soient tous numérotés, et qu les inputs le soient aussi...
 
ainsi, en fonction de l'input renvoyé, je recherche le champs ayant le meme numéro, et c bon...ca me fait un traitement en plus coté serveur...


---------------
Jubi Photos : Flickr - 500px
Reply

Marsh Posté le 27-02-2005 à 23:12:35    

Jubijub a écrit :

-->GM : non , parce que les tables sont carrément plus alignées (ce qui les aligne c la taille du TH, que je peux mettre qu'1x)


Fixe la taille de tes cellules [:spamafote]


Message édité par gm_superstar le 27-02-2005 à 23:12:44

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
Reply

Marsh Posté le 28-02-2005 à 13:48:07    

pas idiot :)...enfin bon, ct plus pour ma culture perso que pour un besoin inpétueux : c pour un projet d'école, et vu le HTML que le prof nous donnait dans ses exemples de servlet, je pense que son compteur s'est bloqué en Quirk mode...
 
c plus pour mon stage, je v bouffer du JSP dans tt les sens, et ca m'intéressait de savoir faire des form valides...parce que là pour le stage ca m'importe plus de sortir du boulot de qualité


---------------
Jubi Photos : Flickr - 500px
Reply

Marsh Posté le    

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed