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

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [JS][FireFox et IE, rendre enabled et disabled un div

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[JS][FireFox et IE, rendre enabled et disabled un div

n°1492074
Clarkent
Musclor le shérif de l'espace
Posté le 15-12-2006 à 19:58:50  profilanswer
 

Petit sous IE Mozilla IE.
Je cherche à rendre un div disabled.
Ca se fait facilement sou sIE avec mondiv.disabled="disabled", par contre ca ne passe pas sous mozilla :(.
Comment faire ?
 

Code :
  1. <html>
  2. <body>
  3. <head>
  4. <SCRIPT language="Javascript">
  5. function check(current,linkpanel)
  6. {
  7. if ( current.checked == false )
  8. {
  9.  linkpanel.disabled="disabled";
  10. }
  11. else
  12. {
  13.  linkpanel.disabled="";
  14. }
  15. }
  16. </SCRIPT>
  17. </head>
  18. <form>
  19. <input type="checkbox" name="CB" value="Checkbox_1" onclick="javascript:check(this,document.getElementById('Checkbox_1_Detail'));">Xavier
  20. <div id="Checkbox_1_Detail">
  21.   <input type=text id="grp" name="grp" value="TOTO">
  22.   <input type="checkbox">TOTO
  23.   <input type="checkbox">TITI
  24.   <input type=button value="Annuler">
  25. </div>
  26. </Form>
  27. </body>
  28. </html>


 
 
EDIT : il y avais d'autres pb, et j'ai remplacele document.all par un getElementsByName("nomDuComposant" ) cela retourne un Array de tous les composants ayant ce le nom "nomDuComposant", pour accéder à un élement suffit de faire getElementsByName("nomDuComposant" )[i].


Message édité par Clarkent le 16-12-2006 à 01:11:53
mood
Publicité
Posté le 15-12-2006 à 19:58:50  profilanswer
 

n°1492079
masklinn
í dag viðrar vel til loftárása
Posté le 15-12-2006 à 20:13:43  profilanswer
 

Bon on va commencer par demander des trucs simples:

  • IE4 et NS4, prière d'oublier ces merdes antédilluvienne
  • dégager les fonctions "checkbrowser" et "getObjectById", tu testes en début de script si document.getElementById existe et s'il n'existe pas le script ne s'exécute pas
  • Je ne veux plus voir de document.all dans ce code.
  • le code HTML est illisible, prière de le simplifier (de dégager toutes ces tables inutiles par exemple) et de le séparer du code Javascript


On verra la suite après.


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1492095
Clarkent
Musclor le shérif de l'espace
Posté le 15-12-2006 à 21:42:50  profilanswer
 

masklinn a écrit :

Bon on va commencer par demander des trucs simples:

  • IE4 et NS4, prière d'oublier ces merdes antédilluvienne
  • dégager les fonctions "checkbrowser" et "getObjectById", tu testes en début de script si document.getElementById existe et s'il n'existe pas le script ne s'exécute pas
  • Je ne veux plus voir de document.all dans ce code.
  • le code HTML est illisible, prière de le simplifier (de dégager toutes ces tables inutiles par exemple) et de le séparer du code Javascript


On verra la suite après.


Je vais essayer d'epurer le code, mais c'est une page de test pour moi en fait :D.

n°1492096
masklinn
í dag viðrar vel til loftárása
Posté le 15-12-2006 à 21:49:02  profilanswer
 

Justement, une page de test doit faire apparaître uniquement ce qui doit être testé :o


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1492100
Clarkent
Musclor le shérif de l'espace
Posté le 15-12-2006 à 22:00:44  profilanswer
 

et bien c'est le tout, le html est la pour montrer l'action.
 
il y a interaction entre els checkbox, et la zone de saisie tout en haut ou c'est indiqué TOTO.
Il y a deux groupes les checbox TOTO_ et les checkbox checkbox_, et suivant celui qui est indique dans la textbox et bien les checkbox agissent comme des radio boutons.
 
si l'onclique sur la zone de titre enfin la bande grise qui délimite des sous partie et bien cette partie doit se réduire et se dérouler, le div est caché ou montré.
 
si l'on coche le premier checkbox et qu'on le decoche les deux chckbox suivante TOTO TITI sont disabled c'est en fait le div qui est disabled.
 
et ce comportement fonctionne tres bien sous IE mais pas du tout sous firefox :(.

n°1492101
Clarkent
Musclor le shérif de l'espace
Posté le 15-12-2006 à 22:01:13  profilanswer
 

Tu peux donc prendre la page tel quelle et l'executer.


Message édité par Clarkent le 15-12-2006 à 22:03:29
n°1492103
masklinn
í dag viðrar vel til loftárása
Posté le 15-12-2006 à 22:15:51  profilanswer
 

Clarkent a écrit :

et bien c'est le tout, le html est la pour montrer l'action.


Il y a beaucoup trop de HTML, la majorité inutile

Clarkent a écrit :

et ce comportement fonctionne tres bien sous IE mais pas du tout sous firefox :(.


Commences par faire ce que je t'ai demandé


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1492106
Clarkent
Musclor le shérif de l'espace
Posté le 15-12-2006 à 22:35:51  profilanswer
 

je vois aps ce que tu veux que je vire en html qui rend cela illisible, c'est avec el html que j'interragis et il n y a que le html avec lequel j'interagis qui est présent dans la page.
 
je vais restreindre, au pire des cas ca ne fonctionnera plus tout seul :/, la au moins je suis sur que tout passe.

n°1492107
Clarkent
Musclor le shérif de l'espace
Posté le 15-12-2006 à 22:39:04  profilanswer
 

j'ai enleve 5 &nbsp, je pense pas que ca aille loin.
Je ne vais pas enlever de checkbox ou des entetes vu que ce sont des elements qui interagissent avec le JS.
 
le reste je ne préfère pas l'enlever si quelqu'un veut se rendre compte par lui meme.
 
Il est tjs plus simple de comprendre un comportement quand celui ci est testable plutot qu'une methode qui ne marche pas du tout non ?

n°1492111
masklinn
í dag viðrar vel til loftárása
Posté le 15-12-2006 à 23:00:05  profilanswer
 

Je parle des tables, elles servent à rien [:petrus75]

 

Dans ton code HTML, la partie utile est au mieux

Code :
  1. <form>
  2.    <input type=text name="grp" value="TOTO">
  3.    <a href="#">Recherche</a>
  4.    <div id="allcheckbox">
  5.        <p><input type="checkbox" name="CB" value="Checkbox_1">Xavier</p>
  6.        <div id="Checkbox_1_Detail">
  7.            <p><input type="checkbox">TOTO</p>
  8.            <p><input type="checkbox">TITI</p>
  9.            <p><input type=button value="Annuler">&nbsp;<input type=button value="Valider"></p>
  10.        </div>
  11.        <input type="checkbox" name="CB" value="Checkbox_2">Nicolas<br>
  12.        <input type="checkbox" name="CB" value="TOTO_1">Joelle<br>
  13.        <input type="checkbox" name="CB" value="Checkbox_4">Eric<br>
  14.        <input type="checkbox" name="CB" value="TOTO_2">Seb<br>
  15.        <input type="checkbox" name="CB" value="Checkbox_6">Philippe<br>
  16.    </div>
  17.    <div id="allresult">
  18.    </div>
  19. </form>

Message cité 1 fois
Message édité par masklinn le 15-12-2006 à 23:00:50

---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
mood
Publicité
Posté le 15-12-2006 à 23:00:05  profilanswer
 

n°1492112
Clarkent
Musclor le shérif de l'espace
Posté le 15-12-2006 à 23:04:27  profilanswer
 

masklinn a écrit :

Je parle des tables, elles servent à rien [:petrus75]
 
Dans ton code HTML, la partie utile est au mieux

Code :
  1. <form>
  2.    <input type=text name="grp" value="TOTO">
  3.    <a href="#">Recherche</a>
  4.    <div id="allcheckbox">
  5.        <p><input type="checkbox" name="CB" value="Checkbox_1">Xavier</p>
  6.        <div id="Checkbox_1_Detail">
  7.            <p><input type="checkbox">TOTO</p>  
  8.            <p><input type="checkbox">TITI</p>  
  9.            <p><input type=button value="Annuler">&nbsp;<input type=button value="Valider"></p>
  10.        </div>
  11.        <input type="checkbox" name="CB" value="Checkbox_2">Nicolas<br>
  12.        <input type="checkbox" name="CB" value="TOTO_1">Joelle<br>
  13.        <input type="checkbox" name="CB" value="Checkbox_4">Eric<br>
  14.        <input type="checkbox" name="CB" value="TOTO_2">Seb<br>
  15.        <input type="checkbox" name="CB" value="Checkbox_6">Philippe<br>
  16.    </div>
  17.    <div id="allresult">
  18.    </div>
  19. </form>



ha :/, bein merci, bein moi je pensais pas que la mise en page était inutile pour que ce soit compréhensible, mais il manque une table avec une colonne une cellule pour pouvoir cliquer dans celle ci et faire apparaitre ou disparaitre un div.

n°1492113
Clarkent
Musclor le shérif de l'espace
Posté le 15-12-2006 à 23:07:45  profilanswer
 

j'ai réduis, est ce plus convenable ?

n°1492115
Clarkent
Musclor le shérif de l'espace
Posté le 15-12-2006 à 23:18:14  profilanswer
 

j'ai supprimé un div et une fonction, un pote a trouvé la solution, c etait le fait de emttre jscript et non pas javascript, maintenant les chckbox genernt des erreurs que ce soit sous ie ou firefox, mais cela fonctionne tout de meme sous ie, il me faut comprendre mon erreur.

n°1492117
Clarkent
Musclor le shérif de l'espace
Posté le 15-12-2006 à 23:37:50  profilanswer
 

getobjectbyid et la methode pour savoir si l'on etait sur un vieuxnavigateur est degagee.

n°1492120
Clarkent
Musclor le shérif de l'espace
Posté le 15-12-2006 à 23:51:54  profilanswer
 

c'est le document.all qui pose problème entre autres :'(.

n°1492124
masklinn
í dag viðrar vel til loftárása
Posté le 16-12-2006 à 00:42:37  profilanswer
 

oui document.all est spécifique à Internet Explorer (et a été remplacé par document.getElementById), et il reste un appel à getObjectById


Message édité par masklinn le 16-12-2006 à 00:46:18

---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1492125
masklinn
í dag viðrar vel til loftárása
Posté le 16-12-2006 à 00:47:47  profilanswer
 

Bien maintenant que le code HTML a été un peu nettoyé, que veux tu que le script fasse exactement?
 
J'ai cru comprendre que la "checkbox_1" avait pour but de faire apparaître ou disparaître le div correspondant, les checkboxes en dessous vont enabler/disabler l'input text?


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1492126
Clarkent
Musclor le shérif de l'espace
Posté le 16-12-2006 à 01:01:11  profilanswer
 

Masklinn, j'ai presque tout corrigé :), il me manque la propriété disabled d'une balise pour firefox.
 
Ici je veux rendre un div disabled en checkant ou non un checkbox, enfin j'ai tout le code sauf ce disabled.
 
sous ie on fait mondiv.disabled="disabled" et ca passe sur firefox non.
 
Je vais updater le code.

n°1492127
Clarkent
Musclor le shérif de l'espace
Posté le 16-12-2006 à 01:21:36  profilanswer
 

A priori rendre un div disabled sous mozilla ce n'est pas possible :(.

n°1492130
mobil12
Posté le 16-12-2006 à 05:37:42  profilanswer
 

regarde la j'ai posé une question similaire et on m'a donc conseillé de faire ce quetu veux, rendre visible ou non un div  
ici  
http://forum.hardware.fr/hfr/Progr [...] 9356_1.htm

n°1492131
gatsu35
Blablaté par Harko
Posté le 16-12-2006 à 06:12:04  profilanswer
 

Clarkent a écrit :

A priori rendre un div disabled sous mozilla ce n'est pas possible :(.


Et puis ca n'aurait pas de sens

n°1492151
Clarkent
Musclor le shérif de l'espace
Posté le 16-12-2006 à 11:12:58  profilanswer
 

rendre visible invisible, aucun souci ;), mais pour moi cela a uneautre signification dans l'interface :p.
mais je vais m'arranger.
 
en quoi ca n'aurait pas de sens ? rendre les choses simple et pratique ca n'a pas de sens ? Si mon conteneur est disabled tout son contenu l'est aussi.
Mais il reste la solution compliquer de chercher tous les composants qui nous interessent et les rendre disabled, et cela aurait plus de sens faut il avoir une nomenclature qui puisse le permettre.

n°1492163
masklinn
í dag viðrar vel til loftárása
Posté le 16-12-2006 à 12:29:06  profilanswer
 

Clarkent a écrit :

en quoi ca n'aurait pas de sens ? rendre les choses simple et pratique ca n'a pas de sens ? Si mon conteneur est disabled tout son contenu l'est aussi.


C'est pas comme ça que ça marche, seuls les éléments de formulaires peuvent être "disabled" et le DIV est un conteneur générique, et même si ton idée a, d'une certaine manière (discutable), du sens, ce que tu désires faire n'est ni prévu ni permis par la norme.
 
De fait, même le conteneur spécifique des formulaires (le fieldset) ne peut à ma connaissance être "disabled".

Clarkent a écrit :

Mais il reste la solution compliquer de chercher tous les composants qui nous interessent et les rendre disabled


Elle n'a en l'occurence rien de compliqué, ça va chercher dans les 5 lignes de js.


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1492236
Clarkent
Musclor le shérif de l'espace
Posté le 16-12-2006 à 18:36:45  profilanswer
 

masklinn a écrit :

C'est pas comme ça que ça marche, seuls les éléments de formulaires peuvent être "disabled" et le DIV est un conteneur générique, et même si ton idée a, d'une certaine manière (discutable), du sens, ce que tu désires faire n'est ni prévu ni permis par la norme.
 
De fait, même le conteneur spécifique des formulaires (le fieldset) ne peut à ma connaissance être "disabled".
 
Elle n'a en l'occurence rien de compliqué, ça va chercher dans les 5 lignes de js.


pour rendre disabled les elements qui sont dedans s'ils sont fixes.
 
ces elements sont créés dynamiquement il peut y en avoir de 1 a N, N n'étant pas borné et la nomenclature de ces N existe déjà, et rien ne permet de dissocié les 1 à N d'une checbox d'une autre.
 
Faut voir que d'un point de vu hiérarchique il peut y avoir 1 à X checkbox ayant la possibilite de desactivé chacune 1 à N checkbox.
 
En JS je le vois pas en 5 Lignes, enfin je vais peut etre tenté le coup en renommant tout ca différement, mais cela me parait assez peu faisable avec la nomenclature actuelle, mais je vais me débrouiller ;).

n°1492243
gatsu35
Blablaté par Harko
Posté le 16-12-2006 à 19:27:02  profilanswer
 

Code :
  1. function checkfromthiselm(elm, containerId) {
  2. var checkcontainer = document.getElementById(containerId);
  3. var allinputs = checkcontainer .getElementsByTagName('input');
  4. for (var i=0; i<allinputs.length; i++) {
  5.   allinputs[i]=x.disabled = elm.checked ? '' : 'disabled';
  6. }
  7. }


En 5 lignes [:petrus75]


Message édité par gatsu35 le 16-12-2006 à 19:35:05
n°1492254
masklinn
í dag viðrar vel til loftárása
Posté le 16-12-2006 à 20:26:49  profilanswer
 

Voila, et en un peu moins lisible on peut aussi écrire

Code :
  1. function disableInputsIfChecked(elm, formContainerId) {
  2.      var inputs = document.getElementById(formContainerId).getElementsByTagName('input');
  3.      for(var i=0,len=inputs.length; i<len; ++i)
  4.             inputs[i].disabled = elm.checked;
  5. }


Et si on se permet l'utilisation de fonctions d'aide on peu arriver à

Code :
  1. function disableInputsIfChecked(elm, formContainerId) {
  2.      var inputs = $(formContainerId).getElementsByTagName('input');
  3.      map(inputs, function(input) { input.disabled = elm.checked; });
  4. }


:o


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1492261
gatsu35
Blablaté par Harko
Posté le 16-12-2006 à 21:36:43  profilanswer
 

Oui mais pour la deuxieme version on a un code totalement illisible et seul quelqu'un qui est warrior ou qui a l'esprit tordu peut reprendre le code :o

n°1492263
masklinn
í dag viðrar vel til loftárása
Posté le 16-12-2006 à 21:49:31  profilanswer
 

J'vois pas ce que ça a d'illisible [:petrus dei]


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1492265
gatsu35
Blablaté par Harko
Posté le 16-12-2006 à 21:54:05  profilanswer
 

Moi j'arrive à comprendre, mais c'est pas tous les jours qu'on passe des fonctions en paramètre :o, et j'en connais qui pigerai pas ton code :/
 
Mais j'admet que c'est lisible là

n°1492270
masklinn
í dag viðrar vel til loftárása
Posté le 16-12-2006 à 22:10:41  profilanswer
 

gatsu35 a écrit :

mais c'est pas tous les jours qu'on passe des fonctions en paramètre :o


Ca dépend qui, je fais ça en permanence perso :o


---------------
Stick a parrot in a Call of Duty lobby, and you're gonna get a racist parrot. — Cody
n°1492308
Clarkent
Musclor le shérif de l'espace
Posté le 17-12-2006 à 01:46:54  profilanswer
 

je ne pensais pas une seconde qu'on pouvait avoir les elements d'un contenu dans un autre. Je ne pensaispas qu'on pouvait faire ca en html, je croyais meme avoir lu qu'on ne le pouvait pas, j'ai du mal comprendre, car vu que document c'est le container et qu'on y arrive y a pas de raison qu'on ne puisse pas :D.
 
Et bien merci, c'est vraiment sympa, j'ai appris un truc ou plutot corriger une grosse connerie que j'avais a l'esprit :D.

n°1492319
Clarkent
Musclor le shérif de l'espace
Posté le 17-12-2006 à 02:49:48  profilanswer
 

masklinn a écrit :

Voila, et en un peu moins lisible on peut aussi écrire

Code :
  1. function disableInputsIfChecked(elm, formContainerId) {
  2.      var inputs = document.getElementById(formContainerId).getElementsByTagName('input');
  3.      for(var i=0,len=inputs.length; i<len; ++i)
  4.             inputs[i].disabled = elm.checked;
  5. }


Et si on se permet l'utilisation de fonctions d'aide on peu arriver à

Code :
  1. function disableInputsIfChecked(elm, formContainerId) {
  2.      var inputs = $(formContainerId).getElementsByTagName('input');
  3.      map(inputs, function(input) { input.disabled = elm.checked; });
  4. }


:o


je ne comprends pas du tout ta deuxieme methode, que fait le $ ainsi que la fonction map ?

n°1492331
gatsu35
Blablaté par Harko
Posté le 17-12-2006 à 10:35:49  profilanswer
 

$ est un raccourci pour getElementById, tu lui passes une string ou une ref d'un élément et dans tout les cas il te retourne l'élément ou null s'il n'existe pas

Code :
  1. function $(obj) {
  2. if(typeof obj == "string" ) {
  3.  return document.getElementById(obj);
  4. } else {
  5.  return obj;
  6. }
  7. }


 
map est une fonction de filtrage qui execute au passage une fonction passée en parametre

Code :
  1. function map(arr, fun) {
  2. var out = [];
  3. for(var i=0; i<arr.length; ++i) {
  4.  out.push(fun(arr[i]));
  5. }
  6. return out;
  7. }

n°1492366
Clarkent
Musclor le shérif de l'espace
Posté le 17-12-2006 à 14:52:58  profilanswer
 

merci.
excellent :D, je vais commencer a aimer ca le JS :D.

mood
Publicité
Posté le   profilanswer
 


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

  [JS][FireFox et IE, rendre enabled et disabled un div

 

Sujets relatifs
Affiche Firefox mais pas IEIncompatibilité entre firefox et IE
probleme d'impression avec FireFoxrendre un float positif (de la maniere la plus tordue)
Code Javascript de formulaire qui marche sous IE mais pas FirefoxRollover sonore compatible firefox
[HTML/CSS] comptatibilité Firefoxprob alignement Firefox/IE
[Flash] popup et firefoxflash firefox mozilla ie safari....
Plus de sujets relatifs à : [JS][FireFox et IE, rendre enabled et disabled un div


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR