Discussion :

[Floréal]

Bonjour,
Je suis confronté à une difficulté que je ne parviens pas à résoudre. Voici le topo:
Je travaille sur une application Java/J2EE sous forme de portlet, cette portlet est divisée en différents scénarios identifiés par un nom de fonction, eux même divisés en "action" (ou étapes). On me demande de mettre n place la possibilité de revenir d'une étape vers celle à laquelle elle succède, et ce de manière générique quelque soit l'endroit où l'on se trouve.
Le passage entre action se fait par paramètre, et je suis parvenu à gérer de manière automatique l'historique de ma navigation.
Mon problème se situe donc uniquement dans la vue (JSP) plus précisément dans du javascript.
Je doit placer un bouton dan ma page JSP mais je ne sais pas à l'avance si ce bouton sera ou non inclus dans un formulaire (je le gère par tag), je ne peux donc pas en faire un submit dans un formulaire puisque un élément form ne peut pas avoir pour parent un autre élément form (cf ici).
Me voila donc contraint de passer par une fonction javascript qui génère un formulaire et le soummet. Pour cela je m'appuie sue cet article de la faq js, et emploi ce code ci:

Code :

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

document.forms["backForm"].submit();

Le comportement de ce script change selon le navigateur, dans tous les cas celui ci ne me donne pas de résultat satisfaisant.
Ma première question est la suivante: peut on utiliser la méthode submit() en faisant appel de cette manière au formulaire.
Si oui, comment m'assurer que le formulaire que j'ai défini à la volée soit bien envoyé?
Merci d'avance pour votre aide!

------------
Anexe
Le Tag JSP pour generer tout ça (j'ai mis XML pour la colorisation, mais c'est bien du JSP):

Code XML :

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
53
54
55
56
<%@tag description="put the tag description here" pageEncoding="windows-1252"%>
 
<%-- The list of normal or fragment attributes can be specified here: --%>
<%@attribute name="browseObj" type="com.lasersymag.obj.BrowseObj" required="true" %>
<%@attribute name="caption" required="false"%>
 
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="VLSC" tagdir="/WEB-INF/tags" %>
<%@ taglib uri="http://java.sun.com/portlet" prefix="portlet"%>
 
<c:set var="label" value="Please set a caption for this button"/>
<c:if test="${caption != null}">
    <c:set var="label" value="${caption}"/>
</c:if>
 
<portlet:actionURL windowState="maximized" portletMode="view" var="baseUrl" />
 
<jsp:useBean class="com.lasersymag.obj.ButtonElementObj" id="backBtn">
    <jsp:setProperty name="backBtn" property="disabled" value="${browseObj.previousParameterMap == null}"/>
    <jsp:setProperty name="backBtn" property="label" value="${label}"/>
    <jsp:setProperty name="backBtn" property="submit" value="${false}"/>
    <jsp:setProperty name="backBtn" property="onclick" value="goBack();"/>
    <jsp:setProperty name="backBtn" property="url" value="${backUrl}"/>
</jsp:useBean>
 
<VLSC:Button buttonElementObj="${backBtn}" />
<c:if test="${browseObj.previousParameterMap != null}">
<script type="text/javascript">
    function goBack() {
        var formElement = document.createElement('form');
        formElement.name = "backForm";
        formElement.action = "${baseUrl}";
        var input;
        /* <c:forEach var="entry" items="${browseObj.previousParameterMap}"> parameter : ${entry.key} */
        /* <c:forEach var="value" items="${entry.value}"> ${entry.key} => ${value} */
        input = document.createElement('input');
        input.type = "hidden";
        input.name = "${entry.key}";
        input.value = "${value}";
        formElement.appendChild(input);
        /* </c:forEach> next ... */
        /* </c:forEach> End */
 
        input = document.createElement('input');
        input.type = "hidden";
        input.name = "browseAction";
        input.value = "back";
        formElement.appendChild(input);
 
        var body = document.getElementsByTagName("body")[0];
        body.appendChild(formElement);
        document.forms["backForm"].submit();
        return true;
    }
</script>
</c:if>

Un exemple de code généré avec l'utilisation de ce tag:

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
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
88
<input onclick="goBack();" type="button" value="Retour" class="submitMouseOut" onMouseOver="this.className='submitMouseOver'" onMouseOut="this.className='submitMouseOut'" />
 
 
 
<script type="text/javascript">
    function goBack() {
        var formElement = document.createElement('form');
        formElement.name = "backForm";
        formElement.action = "/portal/auth/portal/default/VLSC/vlscWindow?action=d&windowstate=maximized&mode=view";
        var input;
        /*  parameter : stepTableParameterList */
        /*  stepTableParameterList => delete */
        input = document.createElement('input');
        input.type = "hidden";
        input.name = "stepTableParameterList";
        input.value = "delete";
        formElement.appendChild(input);
        /*  next ... */
        /*  parameter : stepTableParameterList_SEARCH_COLUMN */
        /*  stepTableParameterList_SEARCH_COLUMN =>  */
        input = document.createElement('input');
        input.type = "hidden";
        input.name = "stepTableParameterList_SEARCH_COLUMN";
        input.value = "";
        formElement.appendChild(input);
        /*  next ... */
        /*  parameter : stepParameterStructure */
        /*  stepParameterStructure => display */
        input = document.createElement('input');
        input.type = "hidden";
        input.name = "stepParameterStructure";
        input.value = "display";
        formElement.appendChild(input);
        /*  next ... */
        /*  parameter : stepTableParameterList_SEARCH_STRING */
        /*  stepTableParameterList_SEARCH_STRING =>  */
        input = document.createElement('input');
        input.type = "hidden";
        input.name = "stepTableParameterList_SEARCH_STRING";
        input.value = "";
        formElement.appendChild(input);
        /*  next ... */
        /*  parameter : stepTableParameterList_ID */
        /*  stepTableParameterList_ID => 4 */
        input = document.createElement('input');
        input.type = "hidden";
        input.name = "stepTableParameterList_ID";
        input.value = "4";
        formElement.appendChild(input);
        /*  next ... */
        /*  parameter : documentScrollTop */
        /*  documentScrollTop => 228 */
        input = document.createElement('input');
        input.type = "hidden";
        input.name = "documentScrollTop";
        input.value = "228";
        formElement.appendChild(input);
        /*  next ... */
        /*  parameter : stepSelectStore */
        /*  stepSelectStore => display */
        input = document.createElement('input');
        input.type = "hidden";
        input.name = "stepSelectStore";
        input.value = "display";
        formElement.appendChild(input);
        /*  next ... */
        /*  parameter : function */
        /*  function => ManagementParameter */
        input = document.createElement('input');
        input.type = "hidden";
        input.name = "function";
        input.value = "ManagementParameter";
        formElement.appendChild(input);
        /*  next ... */
        /*  End */
        
        input = document.createElement('input');
        input.type = "hidden";
        input.name = "browseAction";
        input.value = "back";
        formElement.appendChild(input);
        
        var body = document.getElementsByTagName("body")[0];
        body.appendChild(formElement);
        document.forms["backForm"].submit();
        return true;
    }
</script>

Vous aurez compris que le formulaire renvoi tous les paramètres nécessaire à l'exécution de l'action précédente + browseAction="back" (qui m'est utilie pour indiquer qu'on recule d'un cran dans l'historique l'historique).
Sous Firefox il sommet un formulaire vide à l'action en cours; IE7 il me renvoie une erreur (voir pièce jointe, j'aurais voulu la quoter mais impossible de copier/coller!).

Erratum
En fait, sous firefox cela fonctionne bien. Je n'ai une erreur que sous internet explorer 7.

[Matthieu2000]

c'est un peu tirer par les cheveux ton code!

var formElement = document.createElement('form');

-> il serait plus logique de faire

Code :

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

formElement.submit()

formElement.action = "/portal/auth/portal/default/VLSC/vlscWindow?action=d&windowstate=maximized&mode=view";

si tu passe par le methode get, tu peux aussi continuer à ajouter les paramètres ...

[Floréal]

J'avais déjà essayé cette solution et ça ne semblait pas fonctionner.
Je passe effectivement par une méthode post - je l'ai mise en get pour pouvoir vérifier mes paramétrés sous IE (firebug n'existant pas pour ce dernier), j'avais oublié de remettre la méthode en post avant de soumettre ce thread.
Je vais tout de même réessayer avec ta suggestion demain (car il se fait tard, j'ai le cerveau en compote et donc plus les yeux en face des trous).

[SpaceFrog]

peut etre que la lecture de cet article pourrait resoudre ton souci

http://www.developpez.net/forums/d53...ynamique-form/

[Floréal]

Merci, je vais voir comment je peux l'adapter dans mon cas. Je te donne un retour dès que je l'ai mis en place.

Edit:
ça ne répond pas vraiment au problème que j'ai posé, mon code crée bien le formulaire. Mon soucis c'est simplement de savoir comment le soumettre sous IE7

@Matthieu2000:
Je confirme que le formElement.submit(); ne fonctionne pas. Sinon désolé pour la capilo-tractation du code, mais c'est que comme je l'ai expliqué je n'ai pas vraiment le choix.

[Floréal]

C'est bop, problème , je suis simplement passé par l'id du formulaire en rectifiant mon code de cette façon:

Code :

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

1
2
3
4
5
6
7
formElement.id = "backForm";
/*
 ...
*/
var body = document.getElementsByTagName("body")[0];
body.appendChild(formElement);
document.getElementById("backForm").submit();

Merci tout de même d'y avoir consacré du temps.
sinon joli code, Spacefrog.

[SpaceFrog]

je pense qu'en ayant crée le form avec la methode donnée dans l'article tu aurais pu le soumettre en utilisant la syntaxe:

Code :

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

document.forms['nomduform'].submit()

sinon plus simplement avec l'indice du form

Code :

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

document.forms[0].submit()

0 si c'est le premier ...

[Floréal]

C'est ce que j'ai essayé de faire et ça marchait, mais seulement sous firefox.
Pour la seconde possibilité je ne peux pas prévoir à l'avance si le-dit formulaire sera le premier de la page.
Au final en utilisant l'id de l'élément form j'ai pu m'en sortir convenablement.

[SpaceFrog]

Ceci semble fonctionner ...

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script type='text/javascript'>
function foo(){
var myform=document.createElement('<form name="dynaform">');
myform.action="javascript:alert('coucou')";
document.body.appendChild(myform)
document.forms['dynaform'].submit();
}
</script>
 
</head>
 
<body onload="foo()">
 
</body>