www.webdeveloper.com
Results 1 to 4 of 4

Thread: [RESOLVED] innerHTML converts special characters

Hybrid View

  1. #1

    resolved [RESOLVED] innerHTML converts special characters

    Hi there, I'm a professional programmer, but I'm out of ideas here.

    I use the InnerHTML attribute to extract the HTML-code inside a div and use it in a different program (written in Progress 4GL).

    My problem is that the innerHTML-code doesn't match the written HTML-code...

    Special character codes like &#[some number];, ë and € are converted to their characterset equivalents and shown like that.
    So if I extract those, I no longer see the html-code for these characters, I get some weird characters which even cause errors in my external program, because the charset mismatches.
    It also happens when you use an alert, so this will do if you want to test:
    <input type="button" value="test" onClick="alert(document.getElementById('showtest').innerHTML);" />
    <div id="showtest">test&euml;&euro;&nbsp;test</div>

    So, is there are a way around this in JavaScript? I can't convert those characters to the Progress characterset before opening the page because the div is editable, a user can add special characters in between loading and the use of the javascript code...

    FYI: it's for a Progress e-mail client.

    Thanks for any information or suggestions, I've been thinking about a solition for quite some time, now.

  2. #2
    Join Date
    Feb 2006
    Posts
    2,927
    Sooner or later, if you write code for use on the web, you will have to switch to unicode tools.


    You can escape or urlEncode text you want to transfer in an ascii only format.

    encodeURI('test&#235;€&nbsp;test')

    returned value: (String)
    test&#37;C3%AB%E2%82%AC&nbsp;test

    Another option is to try to re-escape.
    This works for your example, but if your users can input any unicode symbols,
    there will be some that are not defined escapes in HTML-

    Code:
    function rescape(s){
    	var h= ['0','1','2','3','4','5','6','7','8','9','a','b','c','d','e','f'];
    	s= s.replace(/&nbsp;/g,' ').split('');
    	var k, c, m,n,o,p;
    	for(var i= 0; i<s.length; i++){
    		k= s[i];
    		c= k.charCodeAt(0);
    		s[i]= (function(){
    			switch(c){
    				case 60: return "&lt;";
    				case 62: return "&gt;";
    				case 34: return "&quot;";
    				case 38: return "&amp;";
    				default: 
    				if(c> 127){
    					m= c%16;
    					c= Math.floor(c/16);
    					n= c%16;
    					c= Math.floor(c/16);
    					o= c%16;
    					c= Math.floor(c/16);
    					p= c%16;
    					return "&#x"+h[p]+h[o]+h[n]+h[m]+";";
    				}
    				else{
    					return k;
    				}
    			}
    		})();
    	}
    	return s.join('');
    }

    var t= 'test&#235;€&nbsp;test';
    rescape(t)
    // returns test&#x00eb;&#x20ac; test;
    which uses the decimal escapes for &euml;&euro;
    Last edited by mrhoo; 05-21-2010 at 12:01 PM.

  3. #3
    Thanks for your quick response, mrhoo, I'll check if your solutions are applicable in my application, probably tomorrow.

    I'm not making an online web application, it's a local web-client. The client uses an Internet Explorer plugin. Using an editable div-element in the page, I allow users to enter their message. But they can copy and paste from webpages or Word-files, so anything can be expected.

    I hope that your solutions can be used from within Progress, because the innerHTML-attibute is currently being used to get the code.
    I'll let you know if it succeeds or not.

  4. #4
    Great, I was able to use your second solution.

    The first one creates codes which are not interpreted automatically by the browser, the function you made (rescape) does create usable html-code.

    My only problem was getting that code in Progress, using the IE-OCX. I couldn't pass a variable or get the result from a js-function, so I had to run the function, paste the code in a hidden input-tag and extract the code from there.

    Anyway, thanks a lot, mrhoo.
    If I find the time, I'll regularly check these forums to see if I can be of help to others too, but I'm a bit occupied at yoyogames.com.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles