Lorival Smolski Chapuis

Posts Tagged ‘Web’

Buenas, buenas, buenas…

Hoje pela manhã efetuei uma consultoria técnica junto a empresa e-sause, onde Cláudia Cristina Marconato encontrou um problema no componente RSform, sendo este um dos vários disponívels para  o Joomla. Este componente é, basicamente, utilizado para criar formulários permitindo, em uma de suas funções, colocar um belo calendário. O problema reportado foi que não estava funcionando no IE 7 e IE 8, apenas no nosso amigo Firefox. Problema clássico para desenvolvedores web.

No Internet Explorer, basicamente, dava um erro de JavaScript (arquivo calendar.js) na linha 2 384 no seguinte comando:

     // o html é criado anteriormente montando toda a tabela</p>
     this.oDomContainer.innerHTML = html.join("\n");</p>

Se comenta-se o belo comando, não ocorria mais erro de JavaScript porém, entretanto, não funcionava o calendário (óbvio).

Pesquisando, pôde ser visto que, a propriedade InnerHtml possui algumas limitações quanto ao IE e não funciona muito bem com tabelas. O arquivo JS gerava todo o calendário com tabelas e agora o circo estava montado.

Tentamos substituir as tags <table> por <div>. Para a nossa surpresa, não deu erro de JavaScript e o calendário apareceu. Porém também não funcionou, pois estava cheio de <tr> e <td>. O complicado é que o plugin é de terceiro, sendo ruim alterar. Mas neste caso não tivemos opções.

Conheço muito pouco de Joomla, antes que alguêm comece a fazer perguntas dele e seus componentes, porém entendo um pouco de JavaScript e Dom o que ajudou na solução deste problema.

A resposta é simples. A propriedade InnerHtml é somente leitura no IE para <tables> e <tr> e como estava tentando adicionar um conteúdo nele ocorreu o erro.

Como o InnerHtml não podia ser utilizado diretamente no oDomContainer no IE e não queriamos alterar tudo para div, o que resultaria em um novo componente, a solução foi simples: criar uma div dinâmica e colocar o conteúdo do html (tables e tudo mais) dentro dela, visto que a propriedade InnerHtml não é somente leitura para divs no IE.  Substituindo, assim, a linha anterior por estas novas:

   var fatherControl = document.createElement("div");
   fatherControl.innerHTML = html.join("\n");
   this.oDomContainer.appendChild(fatherControl);

Com isto o problema estava solucionado em poucos minutos, funcionando no IE e Firefox.

Caso alguêm tenha problema com este componente ou, mais genéricamente, falando com InnerHtml e tabelas pode usar a solução acima sem precisar alterar todo seu script ou lógica atual.

Abrs

“Paciência e perseverança têm um efeito mágico: diante delas as dificuldades e os obstáculos desaparecem”. John Quincy Adams