CODEWITHSUNDEEP
c#asp.net
Ujjwal
Ujjwal

Reputation: 219

Show different color strings(text) in textbox asp.net

In my asp.net website i have a textbox which provides the log information. I am using this log to display the error,success and other information. What i want to do is i want to show the result text in textbox in color according to the type of log. For eg; i want to display error as red text, success as green and so on.

I tried the following code but using this code changes the color of entire content of textbox.

    /// <summary>
    /// colorIndex (0 = default, 1 = red, 2 = green)
    /// </summary>
    /// <param name="logValue"></param>
    /// <param name="colorIndex"></param>
    private void writeToLog(string logValue, int colorIndex)
    {
        if (colorIndex == 0)
        {
            TextBox2.ForeColor = Color.Black;
        }
        else if(colorIndex == 1)
        {
            TextBox2.ForeColor = Color.Red;
        }
        else if(colorIndex == 2)
        {
            TextBox2.ForeColor = Color.Green;
        }

        TextBox2.Text = "[ " + DateTime.Now + "] " + logValue + Environment.NewLine + TextBox2.Text;

    }

Actually i want the output as follows:

enter image description here

You can see in above output there are three different colors of text in same texbox. This output is actually from the desktop application. And i want to show same type of output in asp.net web page? How can i do it? Please help. Thanks in advance!!

Upvotes: 2

Views: 11134

Answers (5)

Ujjwal
Ujjwal

Reputation: 219

Thanks for the answers everyone! Like Knaģi said, since may client need not to edit the value in log,I thought use of WYSIWYG editors was unnecessary. So for solving my problem i used a div instead of textbox.

<div id = "log" style="border: thin solid #00CC99; width:844px; height:193px; overflow:auto;" runat= "server">
    </div>

And in my code behind i filled the log as:

private void writeToLog(string logValue, int colorIndex)
    {
        logValue = "[ " + DateTime.Now + "] " + logValue;
        if (colorIndex == 0)
        {
          string htmlCode = "<font style='color:black'>"+logValue+"</font><br/>";
          log.InnerHtml = htmlCode + log.InnerHtml;

        }
        else if(colorIndex == 1)
        {
            string htmlCode = "<font style='color:red'>" + logValue + "</font><br/>";
            log.InnerHtml = htmlCode + log.InnerHtml ;
        }
        else if(colorIndex == 2)
        {
            string htmlCode = "<font style='color:green'>" + logValue + "</font><br/>";
            log.InnerHtml = htmlCode + log.InnerHtml ;
        }



    }

Upvotes: 3

Khadim Ali
Khadim Ali

Reputation: 2598

You can use label instead. That way it would be simple and easy to render the text with html span tag to define different styles.

    if (colorIndex == 0)
    {
        Lable2.Text += "<span style='color:Black'>Black information...</span><br/><br/>";
    }
    else if(colorIndex == 1)
    {
        Lable2.Text += "<span style='color:Red'>Red information...</span><br/><br/>";
    }
    else if(colorIndex == 2)
    {
        Lable2.Text += "<span style='color:Green'>Green information...</span><br/><br/>";
    }

Upvotes: 1

manoj
manoj

Reputation: 5663

In asp.net, i think table is best option.and you can change text color using id and class for and give there style by applying css 

<table id="log">
 <tr><th>Response Type</th><th>Response Time</th><th>Response Data </th></tr>
 <tr class="error"><td></td><td></td><td></td></tr>
 <tr class="info"><td></td><td></td><td></td></tr>  
</table>

you need to add row by jQuery or Code behind i think it is help full for you.

Upvotes: 2

ducmami
ducmami

Reputation: 215

You need use RichTextBox or some WYGIWYS editor

Upvotes: 0

Knaģis
Knaģis

Reputation: 21495

You can't use a simple TextBox. Instead you must use one of many WYSIWYG editors. There are many to choose from available with wrappers for any server side language.

But since your code does not really need the user to be able to modify this data, you should simply render HTML code with the correct styles and apply overflow-y: auto; max-height:100px CSS styles so that the scrollbar is rendered when the content is too long.

Upvotes: 2

Related Questions