Disable HTML Markup In “Preview Article”

Question

I have a problem displaying a "preview" of a text on my website. Let's assume it's an article and I only want to display the first 50 letters of the article (people will have to click 'read more' to read the rest), that I have accomplished but my issue now is that it displays the text as HTML.

So, what I do is the following:

<td><%# Eval("Description").ToString().Crop(50, true) %></td>

This line above displays the Description and then calls my TextService.cs to crop the text to 50 letters, as below:

public static string Crop(this string text, int length)
{
    return Crop(text, length, false);
}
public static string Crop(this string text, int length, bool removeBreak)
{
    if (removeBreak)
        text = text.Replace("<br />", " ");
    return (text.Length > length) ? string.Format("{0}...", text.Substring(0, length)) : text;
}

But if I edit my article to a big fat text, then it will be visible in the preview box. How can I display the "preview text" as plain text without any HTML?

I hope it all makes sense - otherwise feel free to ask questions.

Answer 1

There's no out of the box solution in the .NET framework for this.

I personally use this method to clear the html text (falls back to lower .NET frameworks neatly):

/// <summary>
/// Remove HTML tags from string using char array.
/// </summary>
public static string StripTagsCharArray(string source)
{
char[] array = new char[source.Length];
int arrayIndex = 0;
bool inside = false;

for (int i = 0; i < source.Length; i++)
{
    char let = source[i];
    if (let == '<')
    {
    inside = true;
    continue;
    }
    if (let == '>')
    {
    inside = false;
    continue;
    }
    if (!inside)
    {
    array[arrayIndex] = let;
    arrayIndex++;
    }
}
return new string(array, 0, arrayIndex);
}

Source: http://www.dotnetperls.com/remove-html-tags

EDIT: If you can and want to use linq, give archil's method a go.

Answer 2

This can be done very simply using html library like HtmlAgilityPack

    private string TextOnly(string html)
    {
        HtmlDocument doc = new HtmlDocument();
        doc.LoadHtml(html);
        StringBuilder innerTextBuilder = new StringBuilder();

        // filter out text nodes
        foreach (var htmlNode in doc.DocumentNode.DescendantNodes()
                                 .Where(x => x.NodeType == HtmlNodeType.Text))
        {
            innerTextBuilder.Append(htmlNode.InnerText);
        }

        innerTextBuilder.ToString();
    }

Adding length check is up to you :)

Answer 3

I'm using the same method as Rickjaah - Just overwrite the lines you posted from TextService.cs with this

public static string Crop(this string text, int length)
{
    text = StripTagsCharArray(text);
    return (text.Length > length) ? string.Format("{0}...", text.Substring(0, length)) : text;
}


/// <summary>
/// Remove HTML tags from string using char array.
/// </summary>
private static string StripTagsCharArray(string source)
{
  char[] array = new char[source.Length];
  int arrayIndex = 0;
  bool inside = false;

  for (int i = 0; i < source.Length; i++)
  {
      char let = source[i];
      if (let == '<')
      {
      inside = true;
      continue;
      }
      if (let == '>')
      {
      inside = false;
      continue;
      }
      if (!inside)
      {
      array[arrayIndex] = let;
      arrayIndex++;
      }
  }
  return new string(array, 0, arrayIndex);
}