11 Replies Latest reply on Feb 7, 2009 9:12 AM by Palca

    Simple javascript not working

    Palca
      Hello,
      I have got a problem with this simple javascript that works on every browser I tested but not on AIR (1.5.0 on Aptana Studio) :

      <html>
      <head>
      <title>Test</title>
      <script type="text/javascript">
      function init()
      {
      display();
      }

      var nb=10;

      function del()
      {
      nb--;
      display();
      }

      function display()
      {
      var i;
      var res = "";
      for (i=0; i<nb; i++)
      {
      res += "<li><a onclick=\"del();\">link"+ i +"</a></li>";
      }
      document.getElementById("results").innerHTML = "<ul>"+ res +"</ul>";
      }
      </script>
      </head>

      <body onload="init()">
      <p onclick="del()">test</p>
      <div id="results"></div>
      </body>
      </html>

      Clicking on any link in the list should reload this list with one item less, but it only works once, I do not understand why considering this code perfectly works on any browser.
      Clicking on the "test" text in the <p> also works perfectly and I have got no error message in the console, so what is the problem, please?

      Thanks for your help.
        • 1. Re: Simple javascript not working
          jbenson@oper8 Level 2
          Unsure what the problem is. I copied almost verbatim and it worked fine for me.

          here's my script (slightly different due to my base file is xhtml strict)
          quote:

          <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
          <html xmlns=" http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
          <head>
          <title>Adobe Air 1.5 Test</title>
          <script src="lib/AIRAliases.js" type="text/javascript"></script>
          <script src="lib/main.js" type="text/javascript"></script>
          <script type="text/javascript">
          function init(){
          display();
          }

          var nb=10;

          function del(){
          nb--;
          display();
          }

          function display(){
          var i;
          var res = "";
          for (i=0; i<nb; i++)
          res += "<li><a onclick=\"del();\">link"+ i +"</a></li>";
          document.getElementById("results").innerHTML = "<ul>"+ res +"</ul>";
          }

          </script>
          </head>
          <body onload="init();">

          <p onclick="del()">test</p>
          <div id="results"></div>

          </body>
          </html>
          • 2. Re: Simple javascript not working
            Palca Level 1
            Same problem with your code (I only removed the main.js include).
            Clicking one time on an item of the list will call the del() function, but clicking a second time has no effect.
            • 3. Re: Simple javascript not working
              jbenson@oper8 Level 2
              Oh.

              I misunderstood. I thought you wanted us to continuously hit test. My apologies for not reading very thoroughly.

              You're right, that's strange. If you notice when you replace your onclick="del();" in your <A> with "alert('test');" it works fine.

              Well one fix at least for this is using the dom to add the elements instead of using the innerHTML method.

              quote:


              function display(){
              var locResults = document.getElementById('results');
              var locUL = document.createElement('ul')
              var locLI = false;
              for (i=0; i<nb; i++){
              locLI = document.createElement('li')
              locLI.innerHTML = "link " + i;
              locLI.onclick = del;
              locUL.appendChild(locLI);
              }
              locResults.innerHTML = '';
              locResults.appendChild(locUL);
              }



              I realize this isn't perfect for every situation. For what it's worth I really haven't had any issues doing almost exactly what you were doing when I used jquery within AIR $('#results').html(myUL); but then again I haven't tested to see what happens when it's called twice on the same parent element.

              Perhaps this is a bug from the older version of webkit AIR uses?
              • 4. Re: Simple javascript not working
                Joe ... Ward Level 4
                You cannot turn strings into executable code using such things as innerHTML or eval() when your code is running in the application sandbox. This security restriction exists because an AIR application runs with much higher privileges on a user's system then a web app.

                The restriction comes into effect after the onload event has completed. This is why the function works the first time, but not on subsequent clicks.
                • 5. Simple javascript not working
                  Palca Level 1
                  This DOM method will be OK for what I need to do so thanks for the code!

                  Good to know for the innerHTML restriction, I knew for eval() but not for innerHTML.
                  Is there a way to avoid this restriction?
                  • 6. Re: Simple javascript not working
                    jbenson@oper8 Level 2
                    Thanks Joe ... Ward that explains a lot.

                    I recreated the script using jquery and saw the same behavior.

                    It's interesting that you can call things that eval onload or "ready" as jquery puts it but not after. I wonder if Sun considers this a bug or if it's something we can rely on in the future?
                    • 7. Re: Simple javascript not working
                      Joe ... Ward Level 4
                      @jbenson,

                      The reason you can do it until the onload event is that there is no way to execute remote code until then. AIR isn't trying to protect users from YOUR code (which they accepted by installing the app), it's trying to protect users from code that is maliciously injected into an application. This is the intended behavior. (I don't follow your reference to Sun?)
                      • 8. Re: Simple javascript not working
                        jbenson@oper8 Level 2
                        Thanks for clearing that up Joe.

                        As for the sun reference. Too many vendors for me (I was on a Sun forum troubleshooting an issue this morning and java stuff has stuck in my mind throughout the day)
                        • 9. Re: Simple javascript not working
                          Palca Level 1
                          Finally DOM is not so good...

                          I use a function that changes the font size of the page by changing the css propriety of the body. It works very well except for the data generated by DOM.
                          I have tried to apply a class to each tag generated by the DOM but it does not change anything.

                          So, is there a way to avoid this AIR security?
                          To make innerHTML works?
                          • 10. Re: Simple javascript not working
                            Joe ... Ward Level 4
                            Yes, you can avoid this aspect of AIR security by loading the document into a non-application security sandbox using an iframe. The code in the sandboxed page won't be able to call any AIR apis though.

                            That said, the better, simpler approach is to figure out how to set the class using standard Javascript. (I'm far from a Javascript expert, but surely there is a way to do this.)
                            • 11. Re: Simple javascript not working
                              Palca Level 1
                              I have tried to use sandboxes but it is a mess because I need to use AIR API in the other pages so I have to use a bridge for every function I use...

                              Is there really no way of using both "normal" Javascript functions and AIR API in an application?
                              I am trying to make a simple application to manage a database, so I want to use different pages to display, insert and modify the data, but I need both AJAX functions to make it event-oriented and AIR API to interact with the database... I do not see how to do it without using innerHTML...

                              I understand AIR has got security to prevent malicious code from distant pages, but in my case all the pages are included in the application, so why does not AIR accepts "normal" Javascript from these ones?

                              Thanks for your help.