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?

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?

• javascript
• asp
• html
• textarea
• carriage-return

5 Answers 5

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

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

have you tried something like that?

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.

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>'));

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.