Adding a newline character to InnerText property of div

Question

I have a button click event that should take the text from a text box and then write to the InnerText property of a div on the same page. The text is getting inputted to the div, but it's never on a new line. I've tried the following variations: EDIT: To the person who chose to close this question, this is inside of a div and not inside a multi-line text box. They don't work the same, because I had this working when I was using a multi-line text box.

protected void Button1_Click(object sender, EventArgs e)
    {

        if (txtCategory.Text.Length > 0)
        {
            StringBuilder sb = new StringBuilder(drugTerms.InnerText);
            sb.AppendLine(txtCategory.Text);
            drugTerms.InnerText = sb.ToString();
            txtCategory.Text = "";
        }

    }


 protected void Button1_Click(object sender, EventArgs e)
    {

        if (txtCategory.Text.Length > 0)
        {
            StringBuilder sb = new StringBuilder(drugTerms.InnerText);
            sb.Append(txtCategory.Text).Append(Environment.NewLine);
            drugTerms.InnerText = sb.ToString();
            txtCategory.Text = "";
        }

    }

aspx

<%@ Page Language="C#" AutoEventWireup="true" Inherits="_Default" Codebehind="Default.aspx.cs" %>

<!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 id="Head1" runat="server">
    <title>AutoComplete Text Box with jQuery</title>
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css"
        rel="stylesheet" type="text/css" />
    <link href="StyleSheet1.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            SearchText();
        });
        function SearchText() {
            $(".auto").autocomplete({
                source: function (request, response) {
                    $.ajax({
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        url: "Default.aspx/GetAutoCompleteData",
                        data: "{'CategoryName':'" + document.getElementById('txtCategory').value + "'}",
                        dataType: "json",
                        success: function (data) {
                            response(data.d);
                        },
                        error: function (x) {
                            alert("Error Occurred");
                        }
                    });
                }
            });
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div class="demo">
        <div class="ui-widget">
            <label for="tbAuto">
                Enter Drug&nbsp; Name:
            </label>
            <asp:Button ID="Button2" runat="server" OnClick="Button1_Click" Text="Button 2" />
            <asp:TextBox ID="txtCategory" CssClass="auto" runat="server"></asp:TextBox>
            <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button 1" />
            <div id="drugTerms" runat="server"></div>




        </div>
    </div>



    </form>
</body>
</html>

and I tried to add an html break line character in their as well. Every time when the button is clicked the text in the text box is added with the new term being a space instead of the newline character. Why can't I add a new line character in this div?

possible duplicate of [Textbox with "new line"](http://stackoverflow.com/questions/3944410/textbox-with-new-line) - edit: should have put on reading glasses (but only showing relevant code helps, too). This is not a duplicate. — CodeCaster, May 22 '13 at 18:43

score 3 · Answer 1 · answered May 22 '13 at 18:40

3

use "<br>" instead of Environment.NewLine

answered May 22 '13 at 18:40

I4V

34,891
6
67
79

I tried that, but it's not parsing it as html as it's appending only the text `
` – wootscootinboogie May 22 '13 at 18:41
4

@wootscootinboogie use `InnerHtml` instead of `InnerText` – I4V May 22 '13 at 18:44
I had to use the `InnerHtml` property and Append("
"). I have no idea why AppendLine wasn't working. It was adding items with a space, and not a new line character – wootscootinboogie May 22 '13 at 18:47

score 0 · Answer 2 · answered May 22 '13 at 19:01

have you tried using a new Literal and a PlaceHolder?

the aspx:

<asp:PlaceHolder ID="ph" runat="server' visible="true"></asp:PlaceHolder>

then your code behind would look something like this:

c#:

Literal literal = new Literal(); 
lit.Text = "<br/>";
ph.Controls.Add(lit);

I actually do like @I4V's solution of using a break over the environment newline.

Adding a newline character to InnerText property of div

2 Answers2