Appel d'une fonction dans un document.write

[rzawutang44]

Bonjour,

Sans rentrer dans les détails du pourquoi de ma question, est-il possible de passer une fonction X(parametre) dans la fonction write() ?
Vous me direz "Mais pourquoi utiliser write() pour faire ca ?!!?"

Eh bien ca prendrait pas mal de temps à expliquer. Peut-être trouverais-je un autre moyen en refléchissant cette nuit (!) mais en attendant :

Code :

document.write("X(", parametre, ")");

ne produit bien évidemment pas ce que je veux puisque parametre, une fois passée dans le write(), se retrouve "stringé", ce qui me gêne, car parametre n'est pas de type string à l'origine

Est-ce que c'est vraiment ingérable ? Si oui, une proposition ? Sinon, une (autre) proposition ?

Merci

[Bovino]

Mouais... c'est vraiment tordu comme façon de faire et franchement, c'est assez crade (mais vu que tu ne dis pas pourquoi tu tiens à cette méthode, difficile de t'en conseiller une meilleure)...

Bref, write() sert à insérer du code HTML, il faut donc passer par

Code :

document.write('<script type="text/javascript">X('+parametre+')</script>');

[Tsilefy]

Pourquoi ne pas encapsuler document.write dans une fonction? Tu en fais ce que tu veux après.

[RomainVALERI]

Envoyé par rzawutang44

... Sans rentrer dans les détails du pourquoi de ma question, est-il possible de passer une fonction X(parametre) dans la fonction write() ?
Vous me direz "Mais pourquoi utiliser write() pour faire ca ?!!?"

Eh bien ca prendrait pas mal de temps à expliquer. Peut-être trouverais-je un autre moyen en refléchissant cette nuit (!) mais ...

...pour ma part je suis presque certain qu'il y a une erreur de conception quelque part "en amont" qui t'oblige à passer par ce montage impie ().

Même si ça te semble tordu, montre-nous dans quel contexte ça s'insère et je suis sûr qu'on trouvera un moyen de sauver ton âme ( !) rationnaliser ce passage

[sekaijin]

NE PAS UTILISER document.write

Code :

1
2
3
4
var script = document.createElement('script');
script.setAttribute("type","text/javascript");
script.append(document.createTextNode('X(' + parametre + ')' );
document.body.append(script);

A+JYT

[Bovino]

+1 sekaijin

Sinon, tu peux aussi remplacer

Code :

script.appendChild(document.createTextNode('X(' + parametre + ')' ));

par

Code :

script.text = 'X(' + parametre + ')';

[rzawutang44]

Alors, il s'agit d'un simulateur (à la volée) de moyenne universitaire, que j'ai programmé et que j'"intègre" dans le CMS que j'utilise, Spip.

Pour ceux qui connaissent un peu le concept de squelettes Spip, la partie qui permet de lancer le code javascript est, dans le fichier article.html :

Code :

1
2
3
4
5
6
<B_simulation>
  <BOUCLE_simulation(MOTS){id_article}{titre=simulation}>
  <INCLURE{fond=simulation/simulation}>
  </BOUCLE_simulation>
  </B_simulation>
<//B_simulation>

ce qui permet de limiter l'inclusion du code javascript au seul article qui porte le mot cle 'simulation'

Le contenu du fichier simulation/simulation.html :

Code :

1
2
3
4
5
6
<form id="formc" method="post" action="">
	<script type="text/javascript" src="#CHEMIN{simulation/js/declarations.js}"></script>
	<script type="text/javascript" src="#CHEMIN{simulation/js/select.js}"></script>
	<script type="text/javascript" src="#CHEMIN{simulation/js/simulation.js}"></script>
	<script type="text/javascript">construire_tableau_semestre(s1);</script>
</form>

Le fichier de déclarations des unités d'enseignement (UE) et matieres des unités (ECUE), et des coefficients affectés à chaque matière : simulation/js/declarations.js :

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
//ECUEs S1, S2
cli1 = ["CLI1",5];
soc1 = ["SOC1",5];
dev1 = ["DEV1",5];
mppp1 = ["MPPP1",4];
asd1 = ["ASD1",4];
insp = ["INSP",4];
inlp = ["INLP",3];
 
dif1 = ["DIF1",5];
exp1 = ["EXP1",5];
pat1 = ["PAT",5];
psp1 = ["PSP1",4];
anp = ["ANP",4];
iter1 = ["ITER1",2];
tis1 = ["TIS1",2];
libre = ["LIBRE",3];
 
//UEs S1, S2
P1 = ["P1",cli1,soc1,dev1];
MPPP1 = ["MPPP1",mppp1];
ASD1 = ["ASD1",asd1];
COMP = ["COMP",insp,inlp];
 
P2 = ["P2",dif1,exp1,pat1];
PSP1 = ["PSP1",psp1];
ANP = ["ANP",anp];
ITIS1 = ["ITIS1",iter1,tis1];
LIBRE = ["LIBRE",libre];
 
//S1, S2
s1 = ["S1",P1,MPPP1,ASD1,COMP];
s2 = ["S2",P2,PSP1,ANP,ITIS1,LIBRE];

Le fichier simulation/js/select.js
Contient le menu déroulant pour la sélection des notes (0, 0.5, 1, 1.5...20).

Code :

<select = "<option value=\"0\">0</option><option value=\"0.5\">0.5</option><option value=\"1\">1</option><option value=\"1.5\">1.5</option><option value=\"2\">2</option><option value=\"2.5\">2.5</option><option value=\"3\">3</option><option value=\"3.5\">3.5</option><option value=\"4\">4</option><option value=\"4.5\">4.5</option><option value=\"5\">5</option><option value=\"5.5\">5.5</option><option value=\"6\">6</option><option value=\"6.5\">6.5</option><option value=\"7\">7</option><option value=\"7.5\">7.5</option><option value=\"8\">8</option><option value=\"8.5\">8.5</option><option value=\"9\">9</option><option value=\"9.5\">9.5</option><option value=\"10\">10</option><option value=\"10.5\">10.5</option><option value=\"11\">11</option><option value=\"11.5\">11.5</option><option value=\"12\">12</option><option value=\"12.5\">12.5</option><option value=\"13\">13</option><option value=\"13.5\">13.5</option><option value=\"14\">14</option><option value=\"14.5\">14.5</option><option value=\"15\">15</option><option value=\"15.5\">15.5</option><option value=\"16\">16</option><option value=\"16.5\">16.5</option><option value=\"17\">17</option><option value=\"17.5\">17.5</option><option value=\"18\">18</option><option value=\"18.5\">18.5</option><option value=\"19\">19</option><option value=\"19.5\">19.5</option><option value=\"20\">20</option>";

L'idée est un peu naze. Ce fichier va être supprimé, et la liste des notes sera retour d'une fonction select() dans le fichier simulation/js/simulation.js)


Le fichier des fonctions : simulation/js/simultation.js :

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
88
89
90
91
92
93
94
95
function UE(semestre, numero_UE) {
  return semestre[numero_UE];
}
 
function ECUE(unite, numero_ECUE) {
  return unite[numero_ECUE];
}
 
function nom_UE(unite) {
  return unite[0];
}
 
function nom_ECUE(ecue) {
  return ecue[0];
}
 
function nombre_UE(semestre) {
  return semestre.length-1;
}
 
function nombre_ECUE(unite) {
  return unite.length-1;
}
 
function coefficient_ECUE(ecue) {
  return ecue[1];
}
 
function coefficient_UE(unite) {
  var i;
  var c = 0;
 
  for (i = 1; i <= nombre_ECUE(unite); i++) {
    c += coefficient_ECUE(ECUE(unite, i));
  }
  return c;
}
 
function get_note_ECUE(nom_ecue) {
  return parseFloat(document.getElementById(nom_ecue).value);
}
 
function set_moyenne_UE(moyenne, nom_unite) {
  document.getElementById(nom_unite).value = moyenne;
}
 
function recalcule(unite) {
 
  var moy = 0;
  var coeff = 0;
  var i, ecue;
 
  for (i = 1; i <= nombre_ECUE(unite); i++) {
    ecue = ECUE(unite, i);
    coeff += coefficient_ECUE(ecue);
    moy = get_note_ECUE(nom_ECUE(ecue)) * coefficient_ECUE(ecue);
  }
 
  set_moyenne_UE(moy/coeff, nom_UE(unite));
}
 
function construire_ligne_UE(unite) {
 
  var NECUE = nombre_ECUE(unite);
  var NUE = nom_UE(unite);
  var c = "";
  var i;
 
  //document.write('<script type="text/javascript">recalcule('+unite+')</script>');
  // gestion des eventuels rowspan
  c += "<tr><td rowspan=\"" + NECUE + "\">" + nom_UE(unite) + "</td><td rowspan=\"" + NECUE + "\">" + coefficient_UE(unite) + "</td><td>" + nom_ECUE(ECUE(unite, 1)) + "</td><td>" + coefficient_ECUE(ECUE(unite, 1)) + "</td><td><select id=\"" + nom_ECUE(ECUE(unite, 1)) + "\" onchange=\"recalcule(" + NUE + ");\">" + select + "</select></td><td rowspan=\"" + NECUE + "\"><input type=\"text\" size=\"2\" id=\"" + nom_UE(unite) + "\"value=\"0\" style=\"border: 0 solid #000;\"></input></td></tr>";
 
  //plusieurs ECUEs
  if (NECUE > 1) {
    for (i = 2; i <= NECUE; i++) {
      c += "<tr><td>" + nom_ECUE(ECUE(unite, i)) + "</td><td>" + coefficient_ECUE(ECUE(unite, i)) + "</td><td><select id=\"" + nom_ECUE(ECUE(unite, i)) + "\" onchange=\"recalcule(" + NUE + ");\">" + select + "</select></td></tr>";
    }
  }
  return c;
}
 
function construire_tableau_semestre(semestre) {
 
  var debut = "<table class=\"spip\"><tr><th>UEs</th><th>Coeff/UE</th><th>ECUEs</th><th>Coeff/ECUE</th><th>Notes</th><th>Moy/UE</th></tr>";
  var fin = "</table>";
  var c = "";
  var total = "";
  var i;
 
  for (i = 1; i <= nombre_UE(semestre); i++) {
    c += construire_ligne_UE(UE(semestre, i));
  }
  total = debut + c + fin;
  document.write(total);
}

J'ai sans doute pas tout dit, si vous avez des questions, n'hésitez pas !

Note : dans ce que j'ai fait pour l'instant le fichier simulation/simulation.html n'appelle que construire_tableau_semestre(s1) (premier semestre, premiere année d'université).
Plus tard il y aura une boucle pour charger tous les semestres, avec d'autres fichiers de déclarations

[RomainVALERI]

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function construire_tableau_semestre(semestre) {
 
  var debut = "<table class=\"spip\"><tr><th>UEs</th><th>Coeff/UE</th><th>ECUEs</th><th>Coeff/ECUE</th><th>Notes</th><th>Moy/UE</th></tr>";
  var fin = "</table>";
  var c = "";
  var total = "";
  var i;
 
  for (i = 1; i <= nombre_UE(semestre); i++) {
    c += construire_ligne_UE(UE(semestre, i));
  }
  total = debut + c + fin;
  document.write(total);
}

Il me semble qu'il serait plus propre / clair / maintenable / sain / souhaitable / efficace / rationnel (ne rayez aucune mention inutile y'en a pas ^^) de passer par les méthodes DOM (Document.createElement, Element.appendChild, etc.) pour la création de la <table> (voir à ce sujet le post sur la construction de tableaux par SF dans les contributions ^^)

Envoyé par rzawutang44

Code :

<select = "<option value=\"0\">0</option><option value=\"0.5\">0.5</option><option value=\"1\">1</option><option value=\"1.5\">1.5</option><option value=\"2\">2</option><option value=\"2.5\">2.5</option><option value=\"3\">3</option><option value=\"3.5\">3.5</option><option value=\"4\">4</option><option value=\"4.5\">4.5</option><option value=\"5\">5</option><option value=\"5.5\">5.5</option><option value=\"6\">6</option><option value=\"6.5\">6.5</option><option value=\"7\">7</option><option value=\"7.5\">7.5</option><option value=\"8\">8</option><option value=\"8.5\">8.5</option><option value=\"9\">9</option><option value=\"9.5\">9.5</option><option value=\"10\">10</option><option value=\"10.5\">10.5</option><option value=\"11\">11</option><option value=\"11.5\">11.5</option><option value=\"12\">12</option><option value=\"12.5\">12.5</option><option value=\"13\">13</option><option value=\"13.5\">13.5</option><option value=\"14\">14</option><option value=\"14.5\">14.5</option><option value=\"15\">15</option><option value=\"15.5\">15.5</option><option value=\"16\">16</option><option value=\"16.5\">16.5</option><option value=\"17\">17</option><option value=\"17.5\">17.5</option><option value=\"18\">18</option><option value=\"18.5\">18.5</option><option value=\"19\">19</option><option value=\"19.5\">19.5</option><option value=\"20\">20</option>";

L'idée est un peu naze. Ce fichier va être supprimé, et la liste des notes sera retour d'une fonction select() dans le fichier simulation/js/simulation.js)

Oui, et surtout heureusement que c'est pas noté sur 100

[rzawutang44]

Oui, et surtout heureusement que c'est pas noté sur 100

J'avoue j'aurais pu penser à une boucle Je sors ?
Sinon pour le reste je vais regarder avec la fonction de création d'éléments que tu m'as conseillée, ca m'a l'air bien !

Je vous fais un retour plus tard.
Merci