Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1875 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Style.display sur une liste dynamique

 
 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

Style.display sur une liste dynamique

n°1345206
Alexandre5​8
Posté le 12-04-2006 à 16:19:01  profilanswer
 

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


 
 
Merci d'avance pour votre aide !
 
Alexandre


Message édité par Alexandre58 le 12-04-2006 à 16:44:45
mood
Publicité
Posté le 12-04-2006 à 16:19:01  profilanswer
 

n°1345222
anapajari
s/travail/glanding on hfr/gs;
Posté le 12-04-2006 à 16:29:17  profilanswer
 

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!

n°1345247
Alexandre5​8
Posté le 12-04-2006 à 16:44:06  profilanswer
 

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

n°1345289
MS-DOS_199​1
www.newbie-project.net
Posté le 12-04-2006 à 17:06:28  profilanswer
 

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. }
  14. et
  15. <option onClick="createNewInput()">Autre</option>


Message édité par MS-DOS_1991 le 12-04-2006 à 17:07:20
n°1345361
Alexandre5​8
Posté le 12-04-2006 à 18:11:59  profilanswer
 

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>

n°1345402
Alexandre5​8
Posté le 12-04-2006 à 19:06:13  profilanswer
 

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


 
Merci beaucoup d'avance,
Alexandre


Message édité par Alexandre58 le 13-04-2006 à 19:20:28
n°1345675
Alexandre5​8
Posté le 13-04-2006 à 01:04:23  profilanswer
 

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

n°1345691
gatsu35
Blablaté par Harko
Posté le 13-04-2006 à 07:34:32  profilanswer
 

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

n°1345734
anapajari
s/travail/glanding on hfr/gs;
Posté le 13-04-2006 à 09:39:50  profilanswer
 

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]

n°1345739
gatsu35
Blablaté par Harko
Posté le 13-04-2006 à 09:47:49  profilanswer
 

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)

mood
Publicité
Posté le 13-04-2006 à 09:47:49  profilanswer
 

n°1345757
anapajari
s/travail/glanding on hfr/gs;
Posté le 13-04-2006 à 10:00:21  profilanswer
 

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.   }
  50.   </style>
  51. </head>
  52. <body >
  53. <form name="a" action="a.php" method="post">
  55.    <ul class="disp">
  56.      <li><a href="" onclick="return show(this)">Truc 1:</a>
  57.        <ul>
  58.          <li><a href="" onclick="return show(this)">Truc 1_1:</a>
  59.    <select>
  60.      <option>1_1_1</option>
  61.      <option>1_1_2</option>
  63.      <option>1_1_3</option>
  64.    </select>
  65.  </li>
  66.          <li><a href="" onclick="return show(this)">Truc 1_2:</a>
  67.    <select>
  68.      <option>1_2_1</option>
  69.      <option>1_2_2</option>
  71.    </select>
  72.  </li>
  73.        </ul>
  74.      </li>
  75.      <li><a href="" onclick="return show(this)">Truc 2:</a>
  76.        <ul>
  77.          <li><a href="" onclick="return show(this)">Truc 2_1:</a>
  78.    <select>
  80.      <option>2_1_1</option>
  81.      <option>2_1_2</option>
  82.      <option>2_1_3</option>
  83.    </select>
  84.  </li>
  85.          <li><a href="" onclick="return show(this)">Truc 2_2:</a>
  86.    <ul>
  88.              <li><a href="" onclick="return show(this)">Truc 2_2_1:</a>
  89.        <select>
  90.          <option>2_2_1_1</option>
  91.          <option>2_2_1_2</option>
  92.        </select>
  93.      </li>
  94.              <li><a href="" onclick="return show(this)">Autre:</a>
  96.      <input type="text" id="autre" />
  97.      </li>
  98.    </ul>
  99.  </li>
  100.        </ul>
  101.      </li>
  102.    </ul>
  103. </form>
  104. </body>
  106. </html>


 

n°1346401
Alexandre5​8
Posté le 13-04-2006 à 19:26:55  profilanswer
 

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
n°1346411
gatsu35
Blablaté par Harko
Posté le 13-04-2006 à 19:46:44  profilanswer
 

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

n°1346414
Alexandre5​8
Posté le 13-04-2006 à 19:50:39  profilanswer
 

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

n°1346418
gatsu35
Blablaté par Harko
Posté le 13-04-2006 à 19:57:37  profilanswer
 

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

n°1346422
Alexandre5​8
Posté le 13-04-2006 à 20:01:10  profilanswer
 

Euh, un tableau ?

n°1346423
gatsu35
Blablaté par Harko
Posté le 13-04-2006 à 20:06:30  profilanswer
 

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


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Style.display sur une liste dynamique

 

Sujets relatifs
[Mozilla/display:none]Contenu d'une liste en fonction d'une autre le tout dynamiquement
Effet styléTableau dynamique et tri
[RESOLU] créer un tableau dynamique en php[perl]effacer répétitions dans une liste
Liste videliste deroulante
AS2 : Contenu dynamique dans un ScrollpaneSelectionner valeur dans une liste déroulante
Plus de sujets relatifs à : Style.display sur une liste dynamique

Forum MesDiscussions.Net, Version 2010.2
(c) 2000-2011 Doctissimo
Page générée en 0.275 secondes

Copyright © 1997-2025 Groupe LDLC (Signaler un contenu illicite / Données personnelles)