begin process at 2012 05 29 20:55:34
  Trouver un code source :
 
dans
 
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

JavaScript Orienté objet (POO)

 > 

Divers

 > 

Problème avec un array de div et l'attribut className


Derniers messages déposésPoser une question dans le forum ou lancer une discussion

Problème avec un array de div et l'attribut className

mardi 7 octobre 2008 à 17:20:14 | Problème avec un array de div et l'attribut className

Noursounet

Bonjour à tous,

Je suis en train de développer un objet Multiview tout en javascript et je bute sur un problème qui je pense est lié à IE7. Le principe est simple: il faut créer un div conteneur (exemple: "mv") et des divs (autant qu'il y a d'onglets) avec des id qui pour l'exemple seraient "mv1", "mv2", "mv3" (si il y a 3 onglets). Au passage si j'ai fait ainsi c'est pour permettre à l'utilisateur de la classe de remplir ses divs à sa guise et de les convertir en multiview avec mon code JS. A l'instanciation de la classe on passe l'id du div principal (ainsi que d'autres paramètres tels que les dimensions) et la tartine de javascript fait son boulot. J'ai cependant un petit soucis (que j'ai détourné mais ca fait pas très propre d'ou mon message). Je stocke mes objets div dans un array (ils sont donc passés en référence) et lorsque je veux modifier la class CSS,

this.divs[this.oldTab].className='tab_display_none';

, il ne modifie pas la classe css ou du moins il ne l'applique pas...

Mon array est correctement rempli et mon indice currentTab est bon.

Par contre ca opère bien avec

$(this.divId + this.oldTab).className = 'tab_display_none';

à savoir que j'effectue la même opération (à peu de chose près) avec un array d'élements 'td' (qui stocke les onglets) et que le même traitement fonctionne.

Voila merci d'avance pour vos réponses


mardi 7 octobre 2008 à 18:15:06 | Re : Problème avec un array de div et l'attribut className

PetoleTeam

Membre Club
Bonjour,
que contient vraiment this.divs[this.oldTab] un ID ou une référence à l'objet...
;O)
mardi 7 octobre 2008 à 20:26:33 | Re : Problème avec un array de div et l'attribut className

Noursounet

Bonsoir et merci pour ta réponse rapide.

this.divs[this.oldTab - 1] contient bien une référence à mon objet, mais la MAJ de l'attribut 'className' ne s'effectue pas...


Voici la classe JS

var

Multiview = Class.create();

Multiview.prototype = {
   initialize:

function(divId, width, height, headersSize){
      this
.divId = divId;
      this
.width = width;
      this
.height = height;
      this
.headersSize = headersSize;
      this
.currentTab = 0;
      this
.totaltabs = 0;
      this
.oldTab = 0;
      this.divs = new
Array();
      this.tabs = null
;
      this.container = this
.getContainer();
      this.fullHTML = '<table cellspacing="0" cellpadding="0" border="0"><tbody><tr>'
;
   },

   create:

function(){
      this.container.style.height = this.height + "px"
;
      this.container.style.width = this.width + "px"
;
      this.divs = this
.getControls();
      this.tabs = this
.buildTabs();
   },

   getControls:

function(){
      var
i = 1;
      var divsArray = new
Array();
      while ($(this
.divId + i))
      {
         var div = $(this
.divId + i);
         div.className =
"empty_space"
;
         divsArray.push(div);
         i = i + 1;
      }
      return
divsArray;
   },

   getContainer:

function(){
      return ($(this
.divId));
   },

   addTab:

function(text,visible){
      this
.totaltabs += 1;
      
var style = (visible == false ? ' style="display:none;' : ' style="display:block;'
);
      style +=
' height:30px;"'

      this.fullHTML += '<td width="150" align="center" id="header' + this.totaltabs + '"' +    style + '" onclick="mView.changeTab(' + this.totaltabs + ');">' + text + '</td>'
;
   },

   
buildTabs: function
()
   {
      var headers = new
Array();
      this.fullHTML += "</tr></tbody></table>"
;
      this.container.innerHTML = this.fullHTML + this
.container.innerHTML;
      for (var i = 1; i<=this
.divs.length; i++)
      {
         var td = $('header'
+ i);
         td.className=
"tab_unselected"
;
         headers.push(td);
      }
      return
headers;
   },

   changeTab:

function(newTabId)
   {
      this.oldTab = this
.currentTab;
      this
.currentTab = newTabId;
      if (this
.oldTab != 0){
         this.tabs[this.oldTab - 1].className = 'tab_unselected'
;
      }
      this.tabs[this.currentTab - 1].className = 'tab_selected'
;
      if (this
.oldTab != 0){
         this.divs[this.oldTab - 1].className = 'empty_space'
;
         //$(this.divId + (this.oldTab)).className ='empty_space';
      }
      //$(this.divId + (this.currentTab)).className ='content_div'; 
      this.divs[this.currentTab - 1].className = 'content_div'
;
   }
};
et le code HTML correspondant:

<

divclass="ConteneurPrincipal">
   <divid="mv">
      <divid="mv1"align="left">général</div>
      <divid="mv2"align="left">type</div>
      <divid="mv3"align="left">annonce</div>
      <divid="mv4"align="left">Structure</div>
      <divid="mv5"align="left">validation</div>
   </div>
</div>
mercredi 8 octobre 2008 à 05:16:50 | Re : Problème avec un array de div et l'attribut className

PetoleTeam

Membre Club
Bonjour,
difficile de faire tourner le code sans le reconstruire complétement, pas fait,...
de visu rapide, n'y aurait-il pas un problème d'index ?

this.divs[this.oldTab - 1].className = 'empty_space';   // marche pas !
$(this.divId + (this.oldTab)).className ='empty_space'; // marche !


...avec une page de démo en ligne peut être...
;O)


Cette discussion est classée dans : problème, array, div, classname, divs


Répondre à ce message

Sujets en rapport avec ce message

Quelle est la différence entre Frame, IFrame et Div... [ par rem78 ] Bonjour,J'ai un problème de frame que j'utilise pour mon site et qui provoque dans ma fenêtre popup plein écran l'apparitiond'un barre verticale, hors PRoblème en javascript, jeu de pendu [ par Chihiro ] Voilà, j'ai un gros problème dans mon script qui ne marche pas, parce que je suis vraiment nulle en programmation... Est ce que quelqu'un pourrait y j Problème de placement d'une boite div selon la résolution [ par optimed ] Bonjour!Je vous explique mon problème:je suis en train de travailler sur un site optimisé pour du 800x600 avec une boîte div (en position absolue) qui Problème d'affichage d'un div lors d'un clic [ par Ang3lo ] Bonjour à tous,Dans la cadre d'un menu avec sous menu qui apparaissent si un lien est cliqué, j'ai fais ce code :      &nbsp Problème très bizarre avec Div.innerHTML [ par tonic1 ] Bonjour,j'ai un gros problème, et qui me semble très bizarre.Dans mon code, quand je tappe : nom_de_mon_div.innerHTML="coucou"; Aucun probleme sous IE Aide sur un DIV qui se centre pas correctement [ par deubeuliou ] Bonsoir à vous,Voici ma situation:Je fais appel à vos services pour un DIV qui me pose problème depuis maintenant un bail. Tout d'abord, voici mon déb problème de de div images [ par sagaff ] J'ai un problème avec une image et un texte, je vous montre ce que j'aimerai faire via cette image:Donc j'ai tout simplement" <img src=""&gt mettre un div en arriere plan [ par Stephane ] salutvoila, je cree un div identifié :blablapuis apres je le déplace, sans probleme.le pb c'est que mon site est composé de plusieurs page, mais toute Problème de cadre autour d'un div [ par flexx ] Bonjour J'ai créé un div avec une bordure d'un pixel noire et mon cadre apparait de façon bizarre dans le coin inférieur gauche du div sous IE 6. En Problème de DIV lors de la réduction [ par nico3141 ] Bonjour, J'essaye d'utiliser des feuilles de style pour mettre en page un site. Quand


Nos sponsors


Sondage...

Comparez les prix

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 1,950 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales