Carriage returns for textbox (textarea)

Question

I have a textarea with attribute "wrap"="hard" (actually it's server side textbox, but with multiple text mode).

<asp:TextBox TextMode=MultiLine runat=server ID=txt Width=50 Height=50 class=txtclass />

<asp:Button runat=server ID=btnServer OnClick=btn_Click Width=80 Text="Click server" />

<input type="button" value="Click client" onclick="clientclick();" id="btnClient" style="width: 80px;" />

   protected void Page_Load(object sender, EventArgs e)
    {
        txt.Attributes.Add("wrap", "hard");
    }

I enter a text that is wider than the textarea. When I click on client side button the text in alert is without carriage returns (like "111111111").

<script src="jquery-1.5.2.min.js" type="text/javascript"></script> 

<script type="text/javascript">    

function clientclick() {
        alert($('.txtclass').val());          
    }

When I click on server button while debugging I see that the text has carriage returns (like "11111\r\n1111").

protected void btn_Click(object sender, EventArgs args)
    {
        var test = txt.Text;
    }

The question is how can I get a text with carriage returns on the client side?

score 4 · Accepted Answer · edited May 23 '17 at 11:45

4

There are a few people who have posted the same question as you before, and general consensus is that there is no simple, out of the box solution. The fix seems to be to walk the string one word at a time and add the newlines in when it would wrap.

Some sample JS is provided in this case - finding "line-breaks" in textarea that is word-wrapping ARABIC text

edited May 23 '17 at 11:45

Community

1
1

answered Aug 16 '11 at 14:12

tonycoupland

4,127
1
28
27

Thank you for the link. It's just interesting why is that? Server anyway gets the right text with all carriage returns, probably it gets processed some where on post. – Elistan Aug 16 '11 at 14:27
Yeah, from the looks of it, the new lines are added on post to the server. – tonycoupland Aug 16 '11 at 14:35

score 0 · Answer 2 · answered Sep 05 '13 at 21:16

0

Since you are dealing with HTML, you can use the '< BR >' tag to force a line break inside a text box. I struggled with this for a while and finally found this solution. It worked perfectly for me.

answered Sep 05 '13 at 21:16

Mark

1

score 0 · Answer 3 · edited Mar 26 '15 at 01:41

0

Here's how it's done.

Readable version:

S=escape(The_textarea.innerHTML);
S=S.replace(/%0D%0A/g,'<br>');
S=S.replace(/%0A/g,'<br>');
S=S.replace(/%0D/g,'<br>');
S=unescape(S);

Efficient version:

S=unescape(escape(The_textarea.innerHTML).replace(/%0D%0A/g,'<br>').replace(/%0A/g,'<br>').replace(/%0D/g,'<br>'));

edited Mar 26 '15 at 01:41

Nathan Tuggy

2,237
27
30
38

answered Mar 26 '15 at 01:20

Jason

1

I am way n00b to regex so this is a real question, would it be more "Efficient" as `replace(/%0D%0A|%0D|%0A/g,'
');` I had to do something similar, but not with the "%0D%0A" characters, I am wondering if there is something weird with the % to mess this up – BillyNair Oct 28 '15 at 01:06

score 0 · Answer 4 · answered Nov 29 '16 at 16:16

0

The \n\r carriage returns are still there, they just are not being interpreted (changed into HTML).

Therefore, use <br /> elements - on the client side they will be interpreted as HTML and will display line breaks as desired.

answered Nov 29 '16 at 16:16

cssyphus

37,875
18
96
111

score 0 · Answer 5 · answered Aug 16 '11 at 13:41

0

alert($('.txtclass').val().replace(/\r/g,"\r").replace(/\n/g,"\n"));

have you tried something like that?

answered Aug 16 '11 at 13:41

Joseph Marikle

76,418
17
112
129

Carriage returns for textbox (textarea)

5 Answers5