Christine Dubois

Comment supprimer l’espacement blanc autour d’une liste affichée dans une iFrame dans un formulaire Dynamics CRM

Problématique

Lorsqu’on affiche une liste d’éléments associés dans une iFrame au sein d’un formulaire Dynamics CRM (cf. article précédent explicitant le procédé pour y parvenir) , il reste un espace blanc de chaque côté de celle-ci :

Comment supprimer ces espaces de couleur blanche ?

Proposition de solution

Si vous observez l’élément HTML dans la page, à l’aide par exemple de l’Internet Explorer Toolbar (ou des outils de développement de IE8), vous constaterez que ces espaces sont dû :

• d’abord au padding de l’élément HTML correspondant qui n’est malheureusement pas à 0,

• mais aussi, sur la droite, à la zone prévue pour une éventuelle barre de défilement (ce qui explique d’ailleurs que l’espace blanc est plus important à droite qu’à gauche puisqu’il cumule le problème du padding et de la scrollbar).

Conclusion, pour s’en débarrasser il suffit de supprimer les deux :-)

Le code

Voici le code à rajouter dans l’évènement onLoad du formulaire :

ATTENTION : pensez à remplacer le nom de l’iFrame (IFRAME_Clubs) par le nom de votre iFrame à vous !

crmForm.all.IFRAME_Clubs.attachEvent('onreadystatechange',func);

function func(event) {
  //Récupération de l'élément HTML (iframe) sur lequel porte l'évènement
  var target = event.target || event.srcElement;
  //Vérification du statut de chargement du contenu de l'iframe
  if(target.readyState=='complete') {
    //Récupération du body de l'iframe
    iframeBody=target.contentWindow.document.body;
    //Suppression du padding
    iframeBody.childNodes[0].rows[0].cells[0].style.padding = 0; 
    //Suppression de l'emplacement de la scrollbar verticale
    iframeBody.scroll = "no";
  }
}

Pourquoi attacher dynamiquement une fonction en réponse à l’évènement onreadystatechange sur l’iFrame ? 
Tout simplement parce que vous risquez d’accéder au contenu de l’iFrame avant même que celle-ci soit chargée ! L’évènement onreadystatechange se déclenche sur un élément justement lorsque le statut de celui-ci change. On l’utilise donc pour valider que le statut de l’iframe est à la valeur complete, indiquant la fin du chargement de son contenu!