javascript match of new line in IE not working

the situation is as follows.. I ready a value from a mysql field using PHP.. Dispays that value in a HTML div and i'm reading the div's value:

value = document.getElementById("text").innerHTML;
            
if (value.match(/\n/))
{
   alert("new line detected");
}
else
{
   alert("no new lines");
}

but it seems to work only in FF..

IE6/7 doesn't detects the new lines however in the source view of the both browsers the text is displayed on new lines..

any ideas how to fix that ?
LVL 1
SteeleRBGAsked:
Who is Participating?
 
LordOfPortsCommented:
Unfortunately innerText (IE only) behaves the same way, I do not any solution with a div. Could you use <textarea>? Using CSS you could make it appear the same as a DIV and its .value property will return a new line \n correctly.
0
 
SteeleRBGAuthor Commented:
just let me clear it out.. adding nl2br in the PHP won't solve the problem.. i need to keep the HTML format in tacked as is in the MySQL field..
0
 
LordOfPortsCommented:
In IE the innerHTML member method of the div object appears to replace the new line \n with a space. I wrote the code below that outputs each character along with the character code, now in Firefox the innerHMTL function returns the new line, character code 10, but in IE it is replace with a space, character code 32. I am not sure of any solution to this behavior. If you cannot use nl2br in your PHP perhaps you could replace new line \n with 2 or 3 consecutive spaces which will be only displayed as one space in your HTML by default and then when you test the content of the div text using innerHTML you could test for presence of the 2 or 3 spaces.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Untitled Page</title>
    <script type="text/javascript">
    
    function CheckNewLine(divID)
    {
        var nNewLineCode = 10; // Character code for new line
        var bHasNewLine = false;
 
        var sText = document.getElementById(divID).innerHTML;
        
        for(var i = 0; i < sText.length; i++) {
            //alert(sText.charCodeAt(i));
            document.write(sText.substring(i, i + 1) + "<sup><span style=\"color:#CCCCCC;\">" + sText.charCodeAt(i) + "</span></sup>");
            if(parseInt(sText.charCodeAt(i)) == nNewLineCode) {
                bHasNewLine = true;
            }
        }
        
        if(bHasNewLine) {
            alert("FOUND new line.");
        }
        else {
            alert("DID NOT FIND new line.");
        }
    }
    
    </script>
</head>
<body>
<div id="divContent">Test sentence followed by new line.
Test sentence preceeded by new line.</div>
<input type="button" value="Check DIV above for New Line" onclick="CheckNewLine('divContent');" />
 
 
<div id="divContent2">Test sentence without new line.</div>
<input type="button" value="Check DIV above for New Line" onclick="CheckNewLine('divContent2');" />
</body>
</html>

Open in new window

FF.png
IE.png
0
 
SteeleRBGAuthor Commented:
can i ready the content of a div with anything else than innerHTML that may preserve the new line ?
0
 
SteeleRBGAuthor Commented:
well.. the whole idea is to use textarea only if there is a new line else to use the INPUT.. but i can try it out cause the textarea got the option to display only one row..

Thanks you
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.