[Last Call] Learn about multicloud storage options and how to improve your company's cloud strategy. Register Now

x
?
Solved

pass linebreaks through ajax to server from a content editable div

Posted on 2015-01-04
2
Medium Priority
?
132 Views
Last Modified: 2015-01-05
I've used editable for my div in order to make it easy to edit the contents of a web page but when the text is sent to the server using ajax the line breaks have been removed.   What's worse, I can't even detect them using a regular expression.   I've tried many combinations:

            alert($(this).siblings("#body_121").text().replace(/<br>/gm, 'xxx'));
            alert($(this).siblings("#body_121").text().replace(/\n/gm, 'xxx'));
            alert($(this).siblings("#body_121").text().replace(/the/g,"**the**"));
            alert($(this).siblings("#body_121").text().replace(/<br?\/>/g,"break"));
            alert($(this).siblings("#body_121").text().replace(/\r\n/g,"**rn***"));
            alert($(this).siblings("#body_121").text().replace(/\n\r/g,"**nr***"));
            alert($(this).siblings("#body_121").text().replace(/\n/g,"**nnn***"));
            alert($(this).siblings("#body_121").text().replace(/\r/g,"**rrr***"));
            alert($(this).siblings("#body_121").text().replace(/<br>/g,"**rrr***"));
            alert($(this).siblings("#body_121").text().replace(/\r\n|\r|\n/g,"\n"));
            alert($(this).siblings("#body_121").text().replace(/\n\r?/g, 'xxxxx%0D%0A'));
            alert($(this).siblings("#body_121").text().replace(/\x0A/g, '0a'));
            alert($(this).siblings("#body_121").text().replace(/\x0D/g, '0a'))

None of these works detects any line breaks.   Each alert just shows the string without line breaks.  
If i use firebug I can see the linebreaks being added
mmmmm
<br>
<br>
mmmmm
every time I hit enter a new linebreak is added.   I can detect any other character  but even this detects nothing:
alert($(this).siblings("#body_121").text().replace(/[^m]/g, 'xxx'))

If i add any other character it detects it. such as:

 mmmmmgmmm

the g will show up as:

mmmmmxxxmmm
0
Comment
Question by:vrosas_03
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
2 Comments
 
LVL 38

Accepted Solution

by:
Tom Beck earned 2000 total points
ID: 40530239
If you are using contenteditable="true" in a div, and you can wrap the content in <p> tags. Each time you add a return, <p></p> tags are inserted. Then you can just look for the <p> tags in the content to mark the line feeds. Or just send the inner html to the server and the <p> tags will be preserved. If you don't wrap the content of the editable div in <p> tags, some browsers (like Firefox) will insert a <br> in the DOM, but you cannot rely on that.

Test: http://jsfiddle.net/zg7bgn0n/
0
 

Author Closing Comment

by:vrosas_03
ID: 40532553
My main problem was that I was using jQuery.text() rather than jQuery.html to grab the data.  I'll use the advice though to use <p> tags.  Hopefully they will stay during all stages from page to database and back again.  That would simplify using an contenteditable.
0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction ( All good things must come to an end ) The original MySQL API has gone away.  It was deprecated (years ago) by PHP in Version 5.5, and removed from PHP in all current releases .  As a result, the issue is upon us today.  It's time to …
Foolproof security solutions has become one of the key necessities of every e-commerce or Internet banking website. If you too own an online shopping site then its vital for you to equip your web portal with customer security features that can allow…
Wufoo.com provides powerful tools for surveying targeted groups, and utilizing data from completed surveys to find trends, discover areas of demand or customer expectation, and make business decisions on products or services.
Use Wufoo, an online form creation tool, to make powerful forms. Learn how to choose which pages of your form are visible to your users based on their inputs. The page rules feature provides you with an opportunity to create if:then statements for y…

650 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question