How to display a html link in container?

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • Rabbit
    Recognized Expert MVP
    • Jan 2007
    • 12517

    #16
    It would really help to see the code that you are actually running...

    The problem is that something is escaping the HTML. Your code has a function that escaptes HTML. That was the most obvious answer.

    Now that I know you aren't actually using that function and you were just showing me test code and not the actual code you were running, I investigated further.

    The issue is line 4. By then, the HTML has already been escaped. What you need to do then is to unescape the HTML.

    Comment

    • jlellis
      New Member
      • Mar 2015
      • 24

      #17
      What do you mean the actual code? This the actual code from the site. If it helps below I have take out all comments and copied it again here.

      Code:
      <script type="text/javascript">
      function LoadFile() {
          var oFrame = document.getElementById("frmFile");
          var strRawContents = oFrame.contentWindow.document.body.childNodes[0].innerHTML;
          while (strRawContents.indexOf("\r") >= 0)
              strRawContents = strRawContents.replace("\r", "");
          var arrLines = strRawContents.split("\n");
          var html='';
          for (var i = 0; i < arrLines.length; i++) {
              var curLine = arrLines[i];
      
      if(curLine.search("href") > -1)
      {
      var divP1 = '<div>';
      var divP2 = '</div>';
      var tLine = curLine;
      var cat1 = divP1.concat(curLine);
      cat2 = cat1.concat(divP2);
      
      document.getElementById('div1').innerHTML = cat2;
      }
              html += curLine + '<br />';
          }
          document.getElementById('div1').innerHTML+= html;
      }
      </script>
      I have to do something to the incoming string (change it to html) before it is added to the html string. Once it is added to the html string it is too late because after processing, the html string is what goes into the div1.innerHTML.
      Last edited by Rabbit; Mar 23 '15, 08:27 PM. Reason: Please use [code] and [/code] tags when posting code or formatted data. Second warning.

      Comment

      • jlellis
        New Member
        • Mar 2015
        • 24

        #18
        This is code I am running. Here is the result.

        Code:
        <a href="http://steelers.com"> Pittsburg Steelers</a>
        This is line 1.
        This is line 2.
        This is line 3.
        <a href="http://steelers.com"> Pittsburg Steelers</a>
        The http://www.steelers.com win again.
        Last edited by gits; Mar 27 '15, 02:05 PM. Reason: added code tags

        Comment

        • jlellis
          New Member
          • Mar 2015
          • 24

          #19
          The last actually comes out as text not the link. The link appeared when I copied and pasted.

          Comment

          • Rabbit
            Recognized Expert MVP
            • Jan 2007
            • 12517

            #20
            And if you'll notice, the code you just posted is different from the code you originally posted, even when you take out the commented code.

            And like I said in post #16, after you told me that you didn't actually use the escape html function in the code you originally posted, I investigated further. The issue is line 4. By then, the HTML has already been escaped. What you need to do then is to unescape the HTML.

            Comment

            • Rabbit
              Recognized Expert MVP
              • Jan 2007
              • 12517

              #21
              Further investigation reveals a possible way to read it unescaped in the first place. But there is a caveat. Instead of innerHTML, you can use innerText in internet explorer or textContent in other browsers to get the unescaped version of the text. But this requires you to test the browser so you know which version to use.

              A more agnostic approach would be to use the innerHTML version with the escaped text and then unescape it.

              Comment

              • jlellis
                New Member
                • Mar 2015
                • 24

                #22
                OK, thanks. I've been looking at both ways, but leaned toward innerHTML.

                Comment

                • Rabbit
                  Recognized Expert MVP
                  • Jan 2007
                  • 12517

                  #23
                  I think I would lean towards innerHTML as well and unescaping it. It's more likely to work with every browser.

                  Let us know if you have trouble unescaping the HTML.

                  Comment

                  • jlellis
                    New Member
                    • Mar 2015
                    • 24

                    #24
                    Well nothing is working. Seems like a line like
                    <a href="http://www.steelers.co m">Steelers</a> win. I tried escape and unescape and got the same result: it only puts the text version in the div. I want the following in the div
                    Steelers win

                    Code:
                    function LoadFile() {
                        var oFrame = document.getElementById("frmFile");
                        var strRawContents = oFrame.contentWindow.document.body.childNodes[0].innerHTML;
                        while (strRawContents.indexOf("\r") >= 0)
                            strRawContents = strRawContents.replace("\r", "");
                        var arrLines = strRawContents.split("\n");
                        var html='';
                        for (var i = 0; i < arrLines.length; i++) {
                            var curLine = arrLines[i];
                    
                    if(curLine.search("href") > -1)
                    {
                    var divP1 = '<div>';
                    var divP2 = '</div>';
                    var tLine = curLine;
                    var cat1 = divP1.concat(curLine);
                    cat2 = cat1.concat(divP2);
                    //curLine=unescape(cat2);
                    //html += curLine;
                    curLine = unescape(cat2);
                    //document.getElementById('div1').innerHTML = curLine;        
                    html += curLine + '<br />';
                    }
                    else
                            html += curLine + '<br />';
                        }
                        document.getElementById('div1').innerHTML+= html;
                    }
                    </script>

                    Comment

                    • jlellis
                      New Member
                      • Mar 2015
                      • 24

                      #25
                      I put the [code] in this time.

                      Comment

                      • Rabbit
                        Recognized Expert MVP
                        • Jan 2007
                        • 12517

                        #26
                        Where's your code for the unescape function?

                        Comment

                        • jlellis
                          New Member
                          • Mar 2015
                          • 24

                          #27
                          Does anyone else have comments about the question? Thanks.

                          Comment

                          • jlellis
                            New Member
                            • Mar 2015
                            • 24

                            #28
                            Can someone directly answer this question? How can I take this line/string
                            <a href="http://bytes.com">Byte s</a> topics
                            and add it to a div as Bytes topics
                            Don't just say use escape and unescape without an example. The string is appended to other strings that may not have html tags and stored in a variable string. The final string is added to the innerhtml of the div. So basically it seems like adding html to a string.

                            Comment

                            • jlellis
                              New Member
                              • Mar 2015
                              • 24

                              #29
                              Never mind, I think I figured it out.

                              Comment

                              • Rabbit
                                Recognized Expert MVP
                                • Jan 2007
                                • 12517

                                #30
                                If you didn't know what escaping and unescaping HTML meant, you could have asked. I thought you knew what it meant because the code you posted in #3 shows that you used a function called escapeHTML. And I figured if you knew how to write a function to escape HTML, then you knew how to write a function to unescape HTML.

                                Anyways, can you post your final code in case someone else finds this thread and has the same question?

                                Comment

                                Working...