Style.display sur une liste dynamique

Style.display sur une liste dynamique - HTML/CSS - Programmation

Marsh Posté le 12-04-2006 à 16:19:01    

Bonjour,
j'ai fais un script qui permet de selectionner un etablissement dans une première liste puis de selectionner une section dans une seconde liste.
La seconde varie en fonction de la première, seulement j'aimerai afficher un champs de formulaire lorsque l'utilisateur selectionne "Autre" dans la seconde liste mais je n'y arrive pas.
 
Voila ce que ça donne :
http://www.zestudent.net/test.php
 
Et voila le code :

Code :
  1. <SCRIPT LANGUAGE="JavaScript">
  2. function is_numeric(num)
  3. {
  4.  var exp = new RegExp("^[0-9-.]*$","g" );
  5.  return exp.test(num);
  6. }
  7. function ModifierListe(code_item) {
  8. lg = document.frmDemo1.zlItem.length;
  9. for (i = lg - 1; i >= 0; i--) {
  10. document.frmDemo1.zlItem.options[i] = null;
  11. }
  12. code_rub = document.frmDemo1.zlRubrique.selectedIndex;
  13. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100010) {
  14. document.frmDemo1.zlItem.length = 3;
  15. document.frmDemo1.zlItem.options[0].value = " ";
  16. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  17. document.frmDemo1.zlItem.options[1].value = 100023;
  18. document.frmDemo1.zlItem.options[1].text = "Informatique";
  19. if (code_item == 100023) document.frmDemo1.zlItem.options[1].selected = true;
  20. document.frmDemo1.zlItem.options[2].value = "Autre";
  21. document.frmDemo1.zlItem.options[2].text = "Autre";
  22. }
  23. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100011) {
  24. document.frmDemo1.zlItem.length = 2;
  25. document.frmDemo1.zlItem.options[0].value = " ";
  26. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  27. document.frmDemo1.zlItem.options[1].value = "Autre";
  28. document.frmDemo1.zlItem.options[1].text = "Autre";
  29. }
  30. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100016) {
  31. document.frmDemo1.zlItem.length = 9;
  32. document.frmDemo1.zlItem.options[0].value = " ";
  33. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  34. document.frmDemo1.zlItem.options[1].value = 100034;
  35. document.frmDemo1.zlItem.options[1].text = "Droit";
  36. if (code_item == 100034) document.frmDemo1.zlItem.options[1].selected = true;
  37. document.frmDemo1.zlItem.options[2].value = 100035;
  38. document.frmDemo1.zlItem.options[2].text = "Science Politique";
  39. if (code_item == 100035) document.frmDemo1.zlItem.options[2].selected = true;
  40. document.frmDemo1.zlItem.options[3].value = 100036;
  41. document.frmDemo1.zlItem.options[3].text = "Science économique";
  42. if (code_item == 100036) document.frmDemo1.zlItem.options[3].selected = true;
  43. document.frmDemo1.zlItem.options[4].value = 100037;
  44. document.frmDemo1.zlItem.options[4].text = "Science de gestion";
  45. if (code_item == 100037) document.frmDemo1.zlItem.options[4].selected = true;
  46. document.frmDemo1.zlItem.options[5].value = 100038;
  47. document.frmDemo1.zlItem.options[5].text = "Administration";
  48. if (code_item == 100038) document.frmDemo1.zlItem.options[5].selected = true;
  49. document.frmDemo1.zlItem.options[6].value = 100039;
  50. document.frmDemo1.zlItem.options[6].text = "Economique et social";
  51. if (code_item == 100039) document.frmDemo1.zlItem.options[6].selected = true;
  52. document.frmDemo1.zlItem.options[7].value = 100040;
  53. document.frmDemo1.zlItem.options[7].text = "Science de l\'information & de la communication";
  54. if (code_item == 100040) document.frmDemo1.zlItem.options[7].selected = true;
  55. document.frmDemo1.zlItem.options[8].value = "Autre";
  56. document.frmDemo1.zlItem.options[8].text = "Autre";
  57. }
  58. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100017) {
  59. document.frmDemo1.zlItem.length = 4;
  60. document.frmDemo1.zlItem.options[0].value = " ";
  61. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  62. document.frmDemo1.zlItem.options[1].value = 100062;
  63. document.frmDemo1.zlItem.options[1].text = "Eco G";
  64. if (code_item == 100062) document.frmDemo1.zlItem.options[1].selected = true;
  65. document.frmDemo1.zlItem.options[2].value = 100114;
  66. document.frmDemo1.zlItem.options[2].text = "Droit";
  67. if (code_item == 100114) document.frmDemo1.zlItem.options[2].selected = true;
  68. document.frmDemo1.zlItem.options[3].value = "Autre";
  69. document.frmDemo1.zlItem.options[3].text = "Autre";
  70. }
  71. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100018) {
  72. document.frmDemo1.zlItem.length = 2;
  73. document.frmDemo1.zlItem.options[0].value = " ";
  74. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  75. document.frmDemo1.zlItem.options[1].value = "Autre";
  76. document.frmDemo1.zlItem.options[1].text = "Autre";
  77. }
  78. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100019) {
  79. document.frmDemo1.zlItem.length = 3;
  80. document.frmDemo1.zlItem.options[0].value = " ";
  81. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  82. document.frmDemo1.zlItem.options[1].value = 100115;
  83. document.frmDemo1.zlItem.options[1].text = "Cinéma";
  84. if (code_item == 100115) document.frmDemo1.zlItem.options[1].selected = true;
  85. document.frmDemo1.zlItem.options[2].value = "Autre";
  86. document.frmDemo1.zlItem.options[2].text = "Autre";
  87. }
  88. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100020) {
  89. document.frmDemo1.zlItem.length = 9;
  90. document.frmDemo1.zlItem.options[0].value = " ";
  91. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  92. document.frmDemo1.zlItem.options[1].value = 100041;
  93. document.frmDemo1.zlItem.options[1].text = "Comal";
  94. if (code_item == 100041) document.frmDemo1.zlItem.options[1].selected = true;
  95. document.frmDemo1.zlItem.options[2].value = 100042;
  96. document.frmDemo1.zlItem.options[2].text = "Acom";
  97. if (code_item == 100042) document.frmDemo1.zlItem.options[2].selected = true;
  98. document.frmDemo1.zlItem.options[3].value = 100043;
  99. document.frmDemo1.zlItem.options[3].text = "Market pub";
  100. if (code_item == 100043) document.frmDemo1.zlItem.options[3].selected = true;
  101. document.frmDemo1.zlItem.options[4].value = 100044;
  102. document.frmDemo1.zlItem.options[4].text = "Chepam";
  103. if (code_item == 100044) document.frmDemo1.zlItem.options[4].selected = true;
  104. document.frmDemo1.zlItem.options[5].value = 100045;
  105. document.frmDemo1.zlItem.options[5].text = "R.P";
  106. if (code_item == 100045) document.frmDemo1.zlItem.options[5].selected = true;
  107. document.frmDemo1.zlItem.options[6].value = 100046;
  108. document.frmDemo1.zlItem.options[6].text = "BTS";
  109. if (code_item == 100046) document.frmDemo1.zlItem.options[6].selected = true;
  110. document.frmDemo1.zlItem.options[7].value = 100118;
  111. document.frmDemo1.zlItem.options[7].text = "Communication des entreprises";
  112. if (code_item == 100118) document.frmDemo1.zlItem.options[7].selected = true;
  113. document.frmDemo1.zlItem.options[8].value = "Autre";
  114. document.frmDemo1.zlItem.options[8].text = "Autre";
  115. }
  116. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100021) {
  117. document.frmDemo1.zlItem.length = 5;
  118. document.frmDemo1.zlItem.options[0].value = " ";
  119. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  120. document.frmDemo1.zlItem.options[1].value = 100048;
  121. document.frmDemo1.zlItem.options[1].text = "Agence entreprise";
  122. if (code_item == 100048) document.frmDemo1.zlItem.options[1].selected = true;
  123. document.frmDemo1.zlItem.options[2].value = 100049;
  124. document.frmDemo1.zlItem.options[2].text = "Image";
  125. if (code_item == 100049) document.frmDemo1.zlItem.options[2].selected = true;
  126. document.frmDemo1.zlItem.options[3].value = 100050;
  127. document.frmDemo1.zlItem.options[3].text = "Management";
  128. if (code_item == 100050) document.frmDemo1.zlItem.options[3].selected = true;
  129. document.frmDemo1.zlItem.options[4].value = "Autre";
  130. document.frmDemo1.zlItem.options[4].text = "Autre";
  131. }
  132. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100022) {
  133. document.frmDemo1.zlItem.length = 6;
  134. document.frmDemo1.zlItem.options[0].value = " ";
  135. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  136. document.frmDemo1.zlItem.options[1].value = 100055;
  137. document.frmDemo1.zlItem.options[1].text = "Finance";
  138. if (code_item == 100055) document.frmDemo1.zlItem.options[1].selected = true;
  139. document.frmDemo1.zlItem.options[2].value = 100056;
  140. document.frmDemo1.zlItem.options[2].text = "Logistique";
  141. if (code_item == 100056) document.frmDemo1.zlItem.options[2].selected = true;
  142. document.frmDemo1.zlItem.options[3].value = 100057;
  143. document.frmDemo1.zlItem.options[3].text = "Commerce international";
  144. if (code_item == 100057) document.frmDemo1.zlItem.options[3].selected = true;
  145. document.frmDemo1.zlItem.options[4].value = 100058;
  146. document.frmDemo1.zlItem.options[4].text = "Marketing";
  147. if (code_item == 100058) document.frmDemo1.zlItem.options[4].selected = true;
  148. document.frmDemo1.zlItem.options[5].value = "Autre";
  149. document.frmDemo1.zlItem.options[5].text = "Autre";
  150. }
  151. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100023) {
  152. document.frmDemo1.zlItem.length = 5;
  153. document.frmDemo1.zlItem.options[0].value = " ";
  154. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  155. document.frmDemo1.zlItem.options[1].value = 100052;
  156. document.frmDemo1.zlItem.options[1].text = "Finance";
  157. if (code_item == 100052) document.frmDemo1.zlItem.options[1].selected = true;
  158. document.frmDemo1.zlItem.options[2].value = 100053;
  159. document.frmDemo1.zlItem.options[2].text = "Management international";
  160. if (code_item == 100053) document.frmDemo1.zlItem.options[2].selected = true;
  161. document.frmDemo1.zlItem.options[3].value = 100054;
  162. document.frmDemo1.zlItem.options[3].text = "Marketing";
  163. if (code_item == 100054) document.frmDemo1.zlItem.options[3].selected = true;
  164. document.frmDemo1.zlItem.options[4].value = "Autre";
  165. document.frmDemo1.zlItem.options[4].text = "Autre";
  166. }
  167. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100024) {
  168. document.frmDemo1.zlItem.length = 2;
  169. document.frmDemo1.zlItem.options[0].value = " ";
  170. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  171. document.frmDemo1.zlItem.options[1].value = "Autre";
  172. document.frmDemo1.zlItem.options[1].text = "Autre";
  173. }
  174. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100025) {
  175. document.frmDemo1.zlItem.length = 2;
  176. document.frmDemo1.zlItem.options[0].value = " ";
  177. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  178. document.frmDemo1.zlItem.options[1].value = "Autre";
  179. document.frmDemo1.zlItem.options[1].text = "Autre";
  180. }
  181. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100026) {
  182. document.frmDemo1.zlItem.length = 2;
  183. document.frmDemo1.zlItem.options[0].value = " ";
  184. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  185. document.frmDemo1.zlItem.options[1].value = "Autre";
  186. document.frmDemo1.zlItem.options[1].text = "Autre";
  187. }
  188. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100027) {
  189. document.frmDemo1.zlItem.length = 2;
  190. document.frmDemo1.zlItem.options[0].value = " ";
  191. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  192. document.frmDemo1.zlItem.options[1].value = "Autre";
  193. document.frmDemo1.zlItem.options[1].text = "Autre";
  194. }
  195. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100028) {
  196. document.frmDemo1.zlItem.length = 2;
  197. document.frmDemo1.zlItem.options[0].value = " ";
  198. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  199. document.frmDemo1.zlItem.options[1].value = "Autre";
  200. document.frmDemo1.zlItem.options[1].text = "Autre";
  201. }
  202. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100029) {
  203. document.frmDemo1.zlItem.length = 2;
  204. document.frmDemo1.zlItem.options[0].value = " ";
  205. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  206. document.frmDemo1.zlItem.options[1].value = "Autre";
  207. document.frmDemo1.zlItem.options[1].text = "Autre";
  208. }
  209. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100030) {
  210. document.frmDemo1.zlItem.length = 2;
  211. document.frmDemo1.zlItem.options[0].value = " ";
  212. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  213. document.frmDemo1.zlItem.options[1].value = "Autre";
  214. document.frmDemo1.zlItem.options[1].text = "Autre";
  215. }
  216. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100032) {
  217. document.frmDemo1.zlItem.length = 2;
  218. document.frmDemo1.zlItem.options[0].value = " ";
  219. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  220. document.frmDemo1.zlItem.options[1].value = "Autre";
  221. document.frmDemo1.zlItem.options[1].text = "Autre";
  222. }
  223. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100033) {
  224. document.frmDemo1.zlItem.length = 3;
  225. document.frmDemo1.zlItem.options[0].value = " ";
  226. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  227. document.frmDemo1.zlItem.options[1].value = 100065;
  228. document.frmDemo1.zlItem.options[1].text = "mannequin mais que de luxe ;)";
  229. if (code_item == 100065) document.frmDemo1.zlItem.options[1].selected = true;
  230. document.frmDemo1.zlItem.options[2].value = "Autre";
  231. document.frmDemo1.zlItem.options[2].text = "Autre";
  232. }
  233. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100034) {
  234. document.frmDemo1.zlItem.length = 2;
  235. document.frmDemo1.zlItem.options[0].value = " ";
  236. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  237. document.frmDemo1.zlItem.options[1].value = "Autre";
  238. document.frmDemo1.zlItem.options[1].text = "Autre";
  239. }
  240. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100035) {
  241. document.frmDemo1.zlItem.length = 2;
  242. document.frmDemo1.zlItem.options[0].value = " ";
  243. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  244. document.frmDemo1.zlItem.options[1].value = "Autre";
  245. document.frmDemo1.zlItem.options[1].text = "Autre";
  246. }
  247. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100036) {
  248. document.frmDemo1.zlItem.length = 2;
  249. document.frmDemo1.zlItem.options[0].value = " ";
  250. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  251. document.frmDemo1.zlItem.options[1].value = "Autre";
  252. document.frmDemo1.zlItem.options[1].text = "Autre";
  253. }
  254. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100037) {
  255. document.frmDemo1.zlItem.length = 3;
  256. document.frmDemo1.zlItem.options[0].value = " ";
  257. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  258. document.frmDemo1.zlItem.options[1].value = 100059;
  259. document.frmDemo1.zlItem.options[1].text = "Ingenieurie Logicielle";
  260. if (code_item == 100059) document.frmDemo1.zlItem.options[1].selected = true;
  261. document.frmDemo1.zlItem.options[2].value = "Autre";
  262. document.frmDemo1.zlItem.options[2].text = "Autre";
  263. }
  264. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100038) {
  265. document.frmDemo1.zlItem.length = 3;
  266. document.frmDemo1.zlItem.options[0].value = " ";
  267. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  268. document.frmDemo1.zlItem.options[1].value = 100061;
  269. document.frmDemo1.zlItem.options[1].text = "1ere année";
  270. if (code_item == 100061) document.frmDemo1.zlItem.options[1].selected = true;
  271. document.frmDemo1.zlItem.options[2].value = "Autre";
  272. document.frmDemo1.zlItem.options[2].text = "Autre";
  273. }
  274. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100040) {
  275. document.frmDemo1.zlItem.length = 3;
  276. document.frmDemo1.zlItem.options[0].value = " ";
  277. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  278. document.frmDemo1.zlItem.options[1].value = 100064;
  279. document.frmDemo1.zlItem.options[1].text = "Sti";
  280. if (code_item == 100064) document.frmDemo1.zlItem.options[1].selected = true;
  281. document.frmDemo1.zlItem.options[2].value = "Autre";
  282. document.frmDemo1.zlItem.options[2].text = "Autre";
  283. }
  284. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100048) {
  285. document.frmDemo1.zlItem.length = 3;
  286. document.frmDemo1.zlItem.options[0].value = " ";
  287. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  288. document.frmDemo1.zlItem.options[1].value = 100074;
  289. document.frmDemo1.zlItem.options[1].text = "Ecole de commerce";
  290. if (code_item == 100074) document.frmDemo1.zlItem.options[1].selected = true;
  291. document.frmDemo1.zlItem.options[2].value = "Autre";
  292. document.frmDemo1.zlItem.options[2].text = "Autre";
  293. }
  294. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100066) {
  295. document.frmDemo1.zlItem.length = 3;
  296. document.frmDemo1.zlItem.options[0].value = " ";
  297. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  298. document.frmDemo1.zlItem.options[1].value = 100096;
  299. document.frmDemo1.zlItem.options[1].text = "paris";
  300. if (code_item == 100096) document.frmDemo1.zlItem.options[1].selected = true;
  301. document.frmDemo1.zlItem.options[2].value = "Autre";
  302. document.frmDemo1.zlItem.options[2].text = "Autre";
  303. }
  304. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100082) {
  305. document.frmDemo1.zlItem.length = 3;
  306. document.frmDemo1.zlItem.options[0].value = " ";
  307. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  308. document.frmDemo1.zlItem.options[1].value = 100113;
  309. document.frmDemo1.zlItem.options[1].text = "SRC";
  310. if (code_item == 100113) document.frmDemo1.zlItem.options[1].selected = true;
  311. document.frmDemo1.zlItem.options[2].value = "Autre";
  312. document.frmDemo1.zlItem.options[2].text = "Autre";
  313. }
  314. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100083) {
  315. document.frmDemo1.zlItem.length = 3;
  316. document.frmDemo1.zlItem.options[0].value = " ";
  317. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  318. document.frmDemo1.zlItem.options[1].value = 100116;
  319. document.frmDemo1.zlItem.options[1].text = "Droit";
  320. if (code_item == 100116) document.frmDemo1.zlItem.options[1].selected = true;
  321. document.frmDemo1.zlItem.options[2].value = "Autre";
  322. document.frmDemo1.zlItem.options[2].text = "Autre";
  323. }
  324. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100084) {
  325. document.frmDemo1.zlItem.length = 3;
  326. document.frmDemo1.zlItem.options[0].value = " ";
  327. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  328. document.frmDemo1.zlItem.options[1].value = 100117;
  329. document.frmDemo1.zlItem.options[1].text = "cinéma";
  330. if (code_item == 100117) document.frmDemo1.zlItem.options[1].selected = true;
  331. document.frmDemo1.zlItem.options[2].value = "Autre";
  332. document.frmDemo1.zlItem.options[2].text = "Autre";
  333. }
  334. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100085) {
  335. document.frmDemo1.zlItem.length = 3;
  336. document.frmDemo1.zlItem.options[0].value = " ";
  337. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  338. document.frmDemo1.zlItem.options[1].value = 100119;
  339. document.frmDemo1.zlItem.options[1].text = "Publicité - Communication";
  340. if (code_item == 100119) document.frmDemo1.zlItem.options[1].selected = true;
  341. document.frmDemo1.zlItem.options[2].value = "Autre";
  342. document.frmDemo1.zlItem.options[2].text = "Autre";
  343. }
  344. var a5 = document.getElementById("autre" );
  345. var m5 = document.getElementById("etablissementsection" );
  346. var t5 = document.getElementById("zlItem" );
  347. var x5 = document.getElementById("autre2" );
  348. var y5 = document.getElementById("etablissementsection2" );
  349. if (document.frmDemo1.zlRubrique.options[code_rub].value == "Autre" )
  350. {
  351. if (a5.style.display == "none" )
  352. a5.style.display = "block";
  353. t5.style.display = "none";
  354. x5.style.display = "block";
  355. if (m5.style.display == "none" )
  356. m5.style.display = "block";
  357. t5.style.display = "none";
  358. y5.style.display = "block";
  359. }
  360. else
  361. {
  362. a5.style.display = "none";
  363. m5.style.display = "none"; 
  364. y5.style.display = "none"; 
  365. t5.style.display = "block"; 
  366. x5.style.display = "none";
  367. }
  368. }
  369. </SCRIPT>
  370. <FORM METHOD=GET NAME='frmDemo1'>
  371.   <table width="60%" border="0" cellspacing="0" cellpadding="0">
  372.     <tr>
  373.       <td width="49%" valign="top">
  374. <div align="right"><strong>Etablissement :</strong></div></td>
  375.       <td width="2%">&nbsp;</td>
  376.       <td width="49%"> <select name='zlRubrique' onChange='ModifierListe(-1)'>
  377.           <option value=''>Choisissez ...</option>
  378.                     <option value="100033"
  379. >Agence de mannequin</option>
  380.                     <option value="100016"
  381. >Assas</option>
  382.                     <option value="100030"
  383. >Celsa</option>
  384.                     <option value="100019"
  385. >Censier</option>
  386.                     <option value="100034"
  387. >Cours Florent</option>
  388.                     <option value="100035"
  389. >Cours Simon</option>
  390.                     <option value="100082"
  391. >DUT</option>
  392.                     <option value="100032"
  393. >Ecole Normal</option>
  394.                     <option value="100023"
  395. >EDC</option>
  396.                     <option value="100021"
  397. >EFAP</option>
  398.                     <option value="100010"
  399. >Epitech</option>
  400.                     <option value="100025"
  401. >ESSEC</option>
  402.                     <option value="100026"
  403. >HEC</option>
  404.                     <option value="100037"
  405. >IN\'TECH INFO</option>
  406.                     <option value="100022"
  407. >IPAG</option>
  408.                     <option value="100020"
  409. >ISCOM</option>
  410.                     <option value="100048"
  411. >ISTEC</option>
  412.                     <option value="100018"
  413. >Jussieu</option>
  414.                     <option value="100040"
  415. >Lycée</option>
  416.                     <option value="100084"
  417. >paris 1</option>
  418.                     <option value="100083"
  419. >PARIS 11 JEAN MONNET SCEAUX</option>
  420.                     <option value="100038"
  421. >Paris 5</option>
  422.                     <option value="100036"
  423. >Penningen</option>
  424.                     <option value="100027"
  425. >Polytechnique</option>
  426.                     <option value="100011"
  427. >Ranger</option>
  428.                     <option value="100029"
  429. >Saint Louis</option>
  430.                     <option value="100028"
  431. >Science politique</option>
  432.                     <option value="100017"
  433. >Sorbonne</option>
  434.                     <option value="100066"
  435. >st thérese</option>
  436.                     <option value="100085"
  437. >Sup de Pub</option>
  438.                     <option value="100024"
  439. >YSG</option>
  440.                     <option value='Autre'>Autre précisez :</option>
  441.         </select>
  442.         <span id=autre style='display: none'><input name='etablissementsection' id='etablissementsection' type='text' class='case' size='40' style='display: none'></span></td>
  443.     </tr>
  444.     <tr>
  445.       <td width="49%"><div align="right"></div></td>
  446.       <td>&nbsp;</td>
  447.       <td width="49%">&nbsp;</td>
  448.     </tr>
  449.     <tr>
  450.       <td width="49%" valign="top">
  451. <div align="right"><strong>Section :</strong></div></td>
  452.       <td>&nbsp;</td>
  453.       <td width="49%"><select name='zlItem'>
  454.           <option value=''>Choisissez ...</option>
  455.                     <option>
  456.                     </option>\n";
  457.         </select>
  458.                 <SCRIPT LANGUAGE='JavaScript'>
  459. ;ModifierListe(-1);
  460. </SCRIPT>
  461. <span id=autre2 style='display: none'><input name='etablissementsection2' id='etablissementsection2' type='text' class='case' size='40' style='display: none'></span>
  462.       </td>
  463.     </tr>
  464.     <tr>
  465.       <td width="49%"><div align="right"></div></td>
  466.       <td>&nbsp;</td>
  467.       <td width="49%">&nbsp;</td>
  468.     </tr>
  469.     <tr>
  470.       <td>&nbsp;</td>
  471.       <td>&nbsp;</td>
  472.       <td><input name="submit" type='submit' value='Valider'></td>
  473.     </tr>
  474.   </table>
  475. </FORM>
  476. Sélection :<BR>
  477. Rubrique = -1 []<BR>


 
 
Merci d'avance pour votre aide !
 
Alexandre


Message édité par Alexandre58 le 12-04-2006 à 16:44:45
Reply

Marsh Posté le 12-04-2006 à 16:19:01   

Reply

Marsh Posté le 12-04-2006 à 16:29:17    

vu que tu postes dans html/js c'est que tu dois avoir un problème de js!
Alors pourquoi a-t-on le droit a ton code php? Tu veux qu'on en fasse quoi!!!
 
Poste le code généré plutôt!

Reply

Marsh Posté le 12-04-2006 à 16:44:06    

Tu as raison, je viens d'éditer le message. Desolé pour la longueur du script !
 
Alexandre

Reply

Marsh Posté le 12-04-2006 à 17:06:28    

A l'arrache:

Code :
  1. function createNewInput()
  2. {
  3. newLabel = document.createElement('label');
  4. newLabel.setAttribute('for', 'ton_input');
  5. newLabel.appendChild(document.createTextNode('Autre Section: '));
  6. newInput = document.createElement('input');
  7. newInput.setAttribute('name', 'ton_input');
  8. newInput.setAttribute('id', 'ton_input');
  9. newInput.setAttribute('title', 'Nom de la Section...');
  10. newLabel.appendChild(newInput);
  11. document.getElementById('ton_div').appendChild(newLabel);
  12. }
  13. et
  14. <option onClick="createNewInput()">Autre</option>


Message édité par MS-DOS_1991 le 12-04-2006 à 17:07:20
Reply

Marsh Posté le 12-04-2006 à 18:11:59    

Cela me semble vraiment pas mal mais comment j'ajoute mon onclick sur Autre car je met cette option de cette manière :
 
echo " document.frmDemo1.zlItem.options[$cpt].value = \"Autre\";\n";
echo " document.frmDemo1.zlItem.options[$cpt].text = \"Autre\";\n";
 
et non en faisant un <option value='Autre'>Autre</option>

Reply

Marsh Posté le 12-04-2006 à 19:06:13    

Ok, ça marche nikel merci beaucoup pour ton aide !!
 
Néanmoins je me retrouve face à un autre problème seulement sous firefox.
Lorsque je selectionne "Autre précisez :" dans le premier select il doit normalement m'afficher 2 inputs et me faire disparaitre l'autre select. Sous ie c'est ok et sous firefox ça ne fait strictement rien. Je vous reposte le code corrigé :
 
 

Code :
  1. <SCRIPT LANGUAGE="JavaScript">
  2. function ModifierListe(code_item) {
  3. lg = document.frmDemo1.zlItem.length;
  4. for (i = lg - 1; i >= 0; i--) {
  5. document.frmDemo1.zlItem.options[i] = null;
  6. }
  7. code_rub = document.frmDemo1.zlRubrique.selectedIndex;
  8. var a7 = document.getElementById("ton_div" );
  9. var m7 = document.getElementById("ton_input" );
  10. a7.style.display = "none";
  11. m7.style.display = "none";
  12. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100010) {
  13. document.frmDemo1.zlItem.length = 3;
  14. document.frmDemo1.zlItem.options[0].value = " ";
  15. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  16. document.frmDemo1.zlItem.options[1].value = 100023;
  17. document.frmDemo1.zlItem.options[1].text = "Informatique";
  18. if (code_item == 100023) document.frmDemo1.zlItem.options[1].selected = true;
  19. document.frmDemo1.zlItem.options[2].value = "Autre";
  20. document.frmDemo1.zlItem.options[2].text = "Autre";
  21. }
  22. if (document.frmDemo1.zlRubrique.options[code_rub].value == 100011) {
  23. document.frmDemo1.zlItem.length = 2;
  24. document.frmDemo1.zlItem.options[0].value = " ";
  25. document.frmDemo1.zlItem.options[0].text = "Choisissez...";
  26. document.frmDemo1.zlItem.options[1].value = "Autre";
  27. document.frmDemo1.zlItem.options[1].text = "Autre";
  28. }
  29. var a5 = document.getElementById("autre" );
  30. var m5 = document.getElementById("etablissementsection" );
  31. var t5 = document.getElementById("zlItem" );
  32. var x5 = document.getElementById("autre2" );
  33. var y5 = document.getElementById("etablissementsection2" );
  34. var a7 = document.getElementById("ton_div" );
  35. var m7 = document.getElementById("ton_input" );
  36. if (document.frmDemo1.zlRubrique.options[code_rub].value == "Autre" )
  37. {
  38. if (a5.style.display == "none" )
  39. a5.style.display = "block";
  40. t5.style.display = "none";
  41. x5.style.display = "block";
  42. a7.style.display = "none";
  43. if (m5.style.display == "none" )
  44. m5.style.display = "block";
  45. t5.style.display = "none";
  46. y5.style.display = "block";
  47. m7.style.display = "none";
  48. }
  49. else
  50. {
  51. a5.style.display = "none";
  52. m5.style.display = "none"; 
  53. y5.style.display = "none"; 
  54. t5.style.display = "block"; 
  55. x5.style.display = "none";
  56. a7.style.display = "none";
  57. m7.style.display = "none";
  58. }
  59. }
  60. function createNewInput()
  61. {
  62. var a7 = document.getElementById("ton_div" );
  63. var m7 = document.getElementById("ton_input" );
  64. if(document.frmDemo1.zlItem.value == "Autre" ) {
  65. if (a7.style.display == "none" )
  66. a7.style.display = "block";
  67. if (m7.style.display == "none" )
  68. m7.style.display = "block";
  69. }
  70. else
  71. {
  72. a7.style.display = "none";
  73. m7.style.display = "none"; 
  74. }
  75. }
  76. </SCRIPT>
  77. <FORM METHOD=GET NAME='frmDemo1'>
  78.   <table width="60%" border="0" cellspacing="0" cellpadding="0">
  79.     <tr>
  80.       <td width="49%" valign="top">
  81. <div align="right"><strong>Etablissement :</strong></div></td>
  82.       <td width="2%">&nbsp;</td>
  83.       <td width="49%"> <select name='zlRubrique' onChange='ModifierListe(-1)'>
  84.           <option value=''>Choisissez ...</option>
  85.                     <option value="100017"
  86. >Sorbonne</option>
  87.                     <option value="100066"
  88. >st thérese</option>
  89.                     <option value="100085"
  90. >Sup de Pub</option>
  91.                     <option value="100024"
  92. >YSG</option>
  93.                     <option value='Autre'>Autre précisez :</option>
  94.         </select>
  95.         <span id=autre style='display: none'><input name='etablissementsection' id='etablissementsection' type='text' class='case' size='40' style='display: none'></span></td>
  96.     </tr>
  97.     <tr>
  98.       <td width="49%"><div align="right"></div></td>
  99.       <td>&nbsp;</td>
  100.       <td width="49%">&nbsp;</td>
  101.     </tr>
  102.     <tr>
  103.       <td width="49%" valign="top">
  104. <div align="right"><strong>Section :</strong></div></td>
  105.       <td>&nbsp;</td>
  106.       <td width="49%"><select name='zlItem' onChange="createNewInput()">
  107.           <option value=''>Choisissez ...</option>
  108.                     <option>
  109.                     </option>\n";<option value='Autre'>Autre précisez :</option>
  110.         </select>
  111.                 <SCRIPT LANGUAGE='JavaScript'>
  112. ;ModifierListe(-1);
  113. </SCRIPT>
  114. <span id=autre2 style='display: none'><input name='etablissementsection2' id='etablissementsection2' type='text' class='case' size='40' style='display: none'></span>
  115.       </td>
  116.     </tr>
  117.     <tr>
  118.       <td width="49%"><div align="right"></div></td>
  119.       <td>&nbsp;</td>
  120.       <td width="49%">&nbsp;</td>
  121.     </tr>
  122.     <tr>
  123.       <td>&nbsp;</td>
  124.       <td>&nbsp;</td>
  125.       <td><input name="submit" type='submit' value='Valider'></td>
  126.     </tr>
  127.   </table>
  128. <div id="ton_div" style='display: none'> <input name="ton_input" id="ton_input" type="text"></div>
  129. </FORM>
  130. Sélection :<BR>
  131. Rubrique = -1 []<BR>


 
Merci beaucoup d'avance,
Alexandre


Message édité par Alexandre58 le 13-04-2006 à 19:20:28
Reply

Marsh Posté le 13-04-2006 à 01:04:23    

Up car je suis en train de désésperer devant mon écran...

Reply

Marsh Posté le 13-04-2006 à 07:34:32    

ET hop encore un site et un code tout pourri ouéééééééé \o/

Reply

Marsh Posté le 13-04-2006 à 09:39:50    

Gatsu> ça doit faire mal au coeur de voir ça a 7h30 au reveil ...
 
Alexandre58>Si tu simplifies pas un peu ton code personne ne t'aidera, j'ai du mal à croire que les 600 lignes soient nécessaires pour résoudre ton problème [:mlc]

Reply

Marsh Posté le 13-04-2006 à 09:47:49    

tu as la version de ton bouzin sans code ?
en gros un papier ou tout est expliqué (le story board ou plutôt la doc fonctionnelle du bouzin)

Reply

Marsh Posté le 13-04-2006 à 09:47:49   

Reply

Marsh Posté le 13-04-2006 à 10:00:21    

En modifiant un peu ce que j'avais fait là: http://forum.hardware.fr/forum2.ph [...] w=0&nojs=0
ça donne ça:

Code :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
  2.   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" >
  4. <head>
  5.   <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
  6.   <title>Test</title>
  7.   <script type="text/javascript">
  8.   /*** param is a node which has been clicked ***/
  9.   function show(lnkNode){
  10.     var i;
  11.     /*** hiding all select && input 'autre' ***/
  12.     selNodes = document.getElementsByTagName('select');
  13.     for(i=0; i<selNodes.length; i++){
  14.       selNodes[i].className = "";
  15.     }
  16.     document.getElementById('autre').className = "";
  17.     /*** hiding all parentNode.parentNode ul ***/
  18.     ulNodes=lnkNode.parentNode.parentNode.getElementsByTagName('ul');
  19.     for(i=0; i<ulNodes.length; i++){
  20.       ulNodes[i].className = "";
  21.     }
  22.     /*** showing lnk parentChild child ( either ul or select )***/
  23.     var sonsNode = lnkNode.parentNode.getElementsByTagName('*');
  24.     /*** first child is always lnk, so watching the second one ***/
  25.     sonsNode[1].className="disp";
  26.    
  27.     return false;
  28.   }
  29.   </script>
  30.   <style type="text/css">
  31.   ul{
  32.     display: none;
  33.   }
  34.   ul.disp{
  35.     display: block;
  36.   }
  37.   select{
  38.     display: none;
  39.   }
  40.   select.disp{
  41.     display: inline;
  42.   }
  43.   input{
  44.     display: none;
  45.   }
  46.   input.disp{
  47.     display: inline;
  48.   }
  49.   </style>
  50. </head>
  51. <body >
  52. <form name="a" action="a.php" method="post">
  53.    <ul class="disp">
  54.      <li><a href="" onclick="return show(this)">Truc 1:</a>
  55.        <ul>
  56.          <li><a href="" onclick="return show(this)">Truc 1_1:</a>
  57.    <select>
  58.      <option>1_1_1</option>
  59.      <option>1_1_2</option>
  60.      <option>1_1_3</option>
  61.    </select>
  62.  </li>
  63.          <li><a href="" onclick="return show(this)">Truc 1_2:</a>
  64.    <select>
  65.      <option>1_2_1</option>
  66.      <option>1_2_2</option>
  67.    </select>
  68.  </li>
  69.        </ul>
  70.      </li>
  71.      <li><a href="" onclick="return show(this)">Truc 2:</a>
  72.        <ul>
  73.          <li><a href="" onclick="return show(this)">Truc 2_1:</a>
  74.    <select>
  75.      <option>2_1_1</option>
  76.      <option>2_1_2</option>
  77.      <option>2_1_3</option>
  78.    </select>
  79.  </li>
  80.          <li><a href="" onclick="return show(this)">Truc 2_2:</a>
  81.    <ul>
  82.              <li><a href="" onclick="return show(this)">Truc 2_2_1:</a>
  83.        <select>
  84.          <option>2_2_1_1</option>
  85.          <option>2_2_1_2</option>
  86.        </select>
  87.      </li>
  88.              <li><a href="" onclick="return show(this)">Autre:</a>
  89.      <input type="text" id="autre" />
  90.      </li>
  91.    </ul>
  92.  </li>
  93.        </ul>
  94.      </li>
  95.    </ul>
  96. </form>
  97. </body>
  98. </html>


 

Reply

Marsh Posté le 13-04-2006 à 19:26:55    

J'ai tout simplifié et voila un explicatif de mon code :
 
Ligne 8 à 35 > Affichage du premier select
Ligne 37 à 70 > Script qui marche sous ie et déconne sous ff qui permet d'afficher deux select lorsque la première liste est sur "Autre"
Ligne 72 à 88 > Fonction permettant d'afficher un select lorsque l'on est sur "autre" dans la seconde liste.
 
J'espère que c'est plus clair et petit message pour Gatsu35 excuse moi de ne pas produire un code monstrueux dés le début en javascript. J'aimerai bien voir ce que tu fesais il y à quelques mois...
Ce n'est pas une attaque mais je pense qu'il est inutile de faire des posts qui critique la manière de coder de quelqu'un.  
 
Alex


Message édité par Alexandre58 le 13-04-2006 à 19:29:01
Reply

Marsh Posté le 13-04-2006 à 19:46:44    

hummmm on va faire simple :  
 
aurait tu le storyboard complet de ton truc
 
gerne : je choisi telle valeur ca m'affiche tels ou tels trucs :o

Reply

Marsh Posté le 13-04-2006 à 19:50:39    

Ok alors voila le story board :
 
Deux listes
A chaque valeur de la première liste correspond une liste d'option dans la seconde.
 
Lorsque l'on séléctionne "Autre" dans la première elle efface la seconde liste et affiche deux inputs.
Lorsque l'on ne séléctionne pas Autre dans la première on peux séléctionner "Autre" dans la seconde ce qui affiche un input.
 
J'espère que c'est assez claire !
 
Alex

Reply

Marsh Posté le 13-04-2006 à 19:57:37    

et il y aurait moyen que tu nous files un tableau avec ces valeurs ?????
c'est juste histoire de voir ce qu'on peut te faire de propre :D

Reply

Marsh Posté le 13-04-2006 à 20:01:10    

Euh, un tableau ?

Reply

Marsh Posté le 13-04-2006 à 20:06:30    

genre la liste de tes trucs avec les valeurs car c'est le gros dawa à comprendre tu vois
 
sinon tu fais en HTML tes selects :D merki

Reply

Sujets relatifs:

Leave a Replay

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