diff --git a/knowledge-base/grid-line-breaks.md b/knowledge-base/grid-line-breaks.md new file mode 100644 index 000000000..273b8ce9c --- /dev/null +++ b/knowledge-base/grid-line-breaks.md @@ -0,0 +1,71 @@ +--- +title: Render Line Breaks in Grid Column +description: How to create new lines inside a Grid column. +type: how-to +page_title: Render Line Breaks in Grid Column +slug: grid-kb-line-breaks +position: +tags: +ticketid: 1650530 +res_type: kb +--- + +## Environment + + + + + + + +
ProductGrid for Blazor
+ +## Description + +This knowledge base article answers the following questions: + +* How do I display line breaks inside a Grid column? +* Is it possible to render HTML inside a Grid column? + +## Solution + +1. To create a new line break in the HTML content of a Grid cell, replace the `\n` segment with the `
` HTML tag. +2. To render the `
` HTML tag from a string, use a MarkupString. +3. To define the `MarkupString`, use the column's `Template`. + +````CSHTML + + + + + + + + + +@code { + private IEnumerable GridData = Enumerable.Range(1, 10).Select(x => new Item + { + Id = x, + Name = "Item " + x, + Text = "Test\nTest\nTest" + }); + + public class Item + { + public int Id { get; set; } + public string Name { get; set; } + public string Text { get; set; } + } +} +```` + +## See Also + +* [Grid Column Template]({%slug grid-templates-column%}) \ No newline at end of file