Javascript problems reading getElementByID in IE and Chrome

Asked

Viewed 481 times

0

I have an interesting problem and did not know this condition in IE. There is on the site I took to maintain, a call like this: document.getElementByID(...). Well, what happens is that IE is not getting the ID and yes the Name, because there is no ID and yes Name. Well, no Chrome this does not work(correct). What I did, I changed the calls to: document.getElementsByName(...). Well, it should work and it doesn’t work. It makes that mistake on top of jquery-ui.min.js:

Uncaught TypeError: a.plugins[n].push is not a function

This is the code of my js. The element is IFConsultaEmpresa_:

if (pObjAsp != 'X') {
         pagina = pTxtDiretorio + pObjAsp + '?pt=' + pTxtNomeFuncao + p_parametros;

         var cp = new cpaint();
         cp.set_transfer_mode('get');
         cp.set_debug(false);
         cp.call('../../atc/asp/atc0006c.asp', 'auxHistNavegacao', '', pCodFuncao, pTxtDiretorio, pTxtNomeFuncao, pNumeroIframe);

         //torna o iframe invisivel
         for (var i = 1; i <= qtd_iframe; i++) {
               //eval('document.getElementById(\'IFConsultaEmpresa_' + i + '\').height = \'0%\';');

               //Essa alteração para ByName foi necessária para funcionar no Chrome
               eval('document.getElementsByName(\'IFConsultaEmpresa_' + i + '\').height = \'0%\';');
               eval('document[\'all\'].IFConsultaEmpresa_' + i + '.style.display = \'none\';');
         }
         eval('boolIFrame = (IFConsultaEmpresa_' + pNumeroIframe + '.location == \'about:blank\')');

         form01.ifram_carregado.value = 'IFConsultaEmpresa_' + pNumeroIframe;

         if (pCodFuncao == 'ATC84.5.4' || pCodFuncao == 'ATC84.5.5' || pCodFuncao == 'ATC84.5.6' ||
               pCodFuncao == 'ATC84.2.2.2' || pCodFuncao == 'ATC84.2.2.3' ||
               pCodFuncao == 'ATC84.8.2.1' || pCodFuncao == 'ATC84.8.2.2'
            ) {
               boolIFrame = true;
         }

         if (!boolIFrame & pNumeroIframe == '1') {
               //iframe1 exclusívo para abertura/encerramento de atendimento - alteração novo atendimento
               boolIFrame = true;
         }
         if (boolIFrame) {
               eval('document[\'all\'].IFConsultaEmpresa_' + pNumeroIframe + '.src = \'' + pagina + '\';');
         }
         eval('document[\'all\'].IFConsultaEmpresa_' + pNumeroIframe + '.style.display = \'\';');
          //eval('document.getElementById(\'IFConsultaEmpresa_' + pNumeroIframe + '\').height = \'50%\';');

          //Colocado para funcionar no Chrome
         eval('document.getElementsByName(\'IFConsultaEmpresa_' + pNumeroIframe + '\').height = \'50%\';');
      }
   }
   try {
      window.parent['roteiro'].location = '../../ace/ace040a.asp?cod_funcao=' + pCodFuncao;
   } catch (e) {}
   if (form01.ind_visualiza_roteiro.value == 'S') {
      try {
         parent.document['all'].td_roteiro.style.display = '';
      } catch (e) { }
   }
}

Here’s my html with that element:

<iframe width="100%" height="0%" scrolling="auto" name="IFConsultaEmpresa_<%Response.write intI%>" id="Iframe2" src="about:blank" frameBorder="no" style="display:" >
    </iframe>

Behold IFConsultaEmpresa_ is the name and not the ID. How do I fix this?

javascript html google-chrome internet-explorer
  • 1

    A question. If you have the jQuery Libraries in the application, why not use them to avoid these cross browser problems?

  • @Erickgallani, good afternoon. It’s added. That’s the question why you’re giving this stick. I have jquery includes. If I remove Byname and let Byid work

  • 1

    then, you are using Document.getElementsByName which is native javascript. This comes with some problems, because each browser has a way of interpreting this instruction. This was one of the biggest motivators of creating jQuery. You can’t do something like $("[name='Ifconsultingbusiness' + i + ''']") ?

  • I think you are not giving problem with jquery.ui but with some plugin that makes use of jquery.ui

  • @Erickgallani, I can try to do that. Our big problem is this. The site is very large, we estimate more than 2000 pages, reports and etc. I only move in a small part of the site, written in ASP. However, there are many calls that are common to other parts of the site. That’s why it’s not so simple to exchange that for that. If this file is called only in this module, there are no problems there, but otherwise, then we would have to do a very detailed study to see the impact of the change.

  • All right, I understand that kind of problem. Can you tell which or which components are used on this page in question you’re dealing with? Why neither jquery nor jquery.ui conflict with native javascript from any browser. So I think the real error is being masked.

  • @Erickgallani, then, I talked to the leader here, that he has a macro view of the system, he told me that this js is only used in this module, so I will make this test calling by jquery and not by javascript. A question: What about Eval()? I place jquery inside Eval() or I kill Eval(()?

  • keep inside the Val to minimize impacts on your project.

  • @Erickgallani, replaces this expression: Eval('Document.getElementsByName('Ifconsultingcompaa_' + i + '). height = '0%';'); for this other, but I’m picking in quotes, because I think the parenthesis is wrong: Eval($('[name=Ifconsultingcompany_' + i + ']. height = 0%';'));

  • try thus Eval('$("[name=Ifquerycompan_' + i + '"]. height = '0%';'));

  • The error continues: Uncaught Typeerror: a.plugins[n]. push is not a Function. I did so: Eval('$("[name=IfqueryCompany_' + i + ']"). height = '0%';');

  • 1

    @pnet, only one note getElementByID returns a Element while getElementsByName returns a NodeList, then for your example to work, you would need to access the first element of the list document.getElementsByName(name)[0].

  • @Tobymosque, thank you very much. I had already done it at the suggestion of a colleague. I will close the post with the reply I gave, but many comments led me to the solution, mainly at the time of Gallani and this comment, also worth, but I had already done so at the suggestion of another colleague, even so thank you.

Show 8 more comments

2 answers

3


I resolved it. Well, the Revolution for no other person was not possible, although everyone here guided me on the way. Because I say it. Well, talking to the person in charge here, we had to duplicate the file . Asp to have no impact on other calls outside the module. Then I changed the ID of the element to the same of Name. So it was possible to take it by Byid and it worked. Why duplicate? There is in other parts of the system a call to the old ID, then we duplicate and leave a file only for the module in am and the other file for the other modules. A nut solution, but for a site that’s been on the air for over 10 years and suffering from patches, we had to do it. The company studies a possibility to rewrite the site, but it takes time. There is high cost involved and the solution is not that simple. The answer for justice should be from Erickgallani, because he’s the one who made me see this side of duplication.

  • often working with large systems and mainly systems that are long in the market we suffer from the legacy. Mainly because 110% of the time we do not have time to analyze the problem thoroughly and write a solution that is the most correct. But I’m glad you managed to solve your problem. And so, bones of our craft hehe.

0

I’m not sure about the mistake but what you can do is this

if ( navigator.userAgent.toLowerCase().indexOf('chrome') > -1 ){
  //Faz alguma coisa se for chrome
}

Anything gives a touch and checks if this function error does not happen by any other particularity.

Browser other questions tagged javascript html google-chrome internet-explorer

You are not signed in. Login or sign up in order to post.