• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Break Line with JS

Guest
Jun 03, 2012 Jun 03, 2012

Copy link to clipboard

Copied

Hi,

I use cfset to set a message with several lines using "\n" in CFC. For example:

<cfset message = message & #JSStringFormat(namelist.name)# & '\n'>

Then, when I use alert('#message#') in CFC, it shows the message with several lines correctly.

Then, I use:

document.getElementById('nameList').innerHTML = '#message#';

to return the name list to CFM page.

However, when I use alert(document.getElementById('nameList').innerHTML) in CFM, it shows message incorrectly. it only shows me all name with a delimiter " ".

It seems the line break character "\n" cannot work correctly. Can anyone help me to solve this problem?

Views

2.8K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Deleted User
Jun 06, 2012 Jun 06, 2012

Thanks for your help.

Lastly, I find that I can use innerText to solve the problem.

Votes

Translate

Translate
Participant ,
Jun 04, 2012 Jun 04, 2012

Copy link to clipboard

Copied

Once you set the innerHTML property then read it, you get back HTML not a Javascript string.  If you want line breaks in HTML then you use the <br> tag.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guest
Jun 04, 2012 Jun 04, 2012

Copy link to clipboard

Copied

I have tried both \n and <br/>, they also cannot show correctly.

For example, if my list is A, B, C

1) \n will show A B C

2) <br /> will show A<BR>B<BR>C

But what I want is:

A

B

C

Is there any method to do it well?

I have tested it in Google Chrome, it run correctly with "\n". But my company use IE 8. IE 8 fails to do it.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Jun 05, 2012 Jun 05, 2012

Copy link to clipboard

Copied

Ok, so innerHTML returns HTML, but alert expects a javascript string.  In order for a Javascript string to show new lines you need the \n char.  But once you set the innerHTML property those are replaced with actual new line characters.  So when you read the innerHTML property to get the actual chars back.  So, you need to replace those chars with \n on the javascript side. (This is what jsStringFormat is doing for you on the server side)

Do you follow?  You are getting the actual newline chars back but the Javascript alert needs the \n special character to display them.

You might have better luck using an HTML modal window and just displaying the HTML as is rather than use an alert();  Most people shy away from using alert as its not very user friendly.  Something like the jQuery UI Dialog widget would work but I'm not sure if you are comfortable enough with Javascript.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Guest
Jun 06, 2012 Jun 06, 2012

Copy link to clipboard

Copied

Thanks for your help.

Lastly, I find that I can use innerText to solve the problem.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jun 06, 2012 Jun 06, 2012

Copy link to clipboard

Copied

LATEST

Hi

InnerHTML is not an issue always. Please have a look into the following code. I could show the display with line break

<cfset message = "Welcome">

<cfset names = arraynew(1)>

<cfset count = 1>

<cfloop index="loopcount" from=1 to=12>

    <cfset names[loopcount]=count>

    <cfset count = count + 1>

</cfloop>

<cfloop array="#names#" index="name">

    <cfset message = message & ' ' & #JSStringFormat(name)# & '<br>'>

</cfloop>

<p id="test"></p>

<script language="javascript" type="text/javascript">

    alert(document.getElementById("test"))

    document.getElementById("test").innerHTML = '<cfoutput>#MESSAGE#</cfoutput>';

</script>

Please let me know which html ctrl you are using the message to be displayed

Regards

Sreekar

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Resources
Documentation