How to do break line in grid row?

[Bart]

Hi. It is possible to use <br/> in a grid ej2 row?

Regards

[Rajapandi Ravi]

Hi Bart, 

Greetings from syncfusion support 

From validating your query, we could see that you like break the line in Grid row. You can achieve your requirement by Value Accessor feature of Grid. we also disabled the disableHtmlEncode property to hide the HTML content .Please refer the below code example and sample for more information. 

@{ 

    var valueAccessor = "valueAccessorFn"; 

} 

 

<div class="control-section"> 

    @( 

         @Html.EJS().Grid<gridmvclocalization.Controllers.OrdersDetails>("Grid").DataSource((IEnumerable<object>)ViewBag.dataSource).Columns(col => 

            { 

               col.Field("OrderID").HeaderText("Order ID").IsPrimaryKey(true).Width("100").Add(); 

               col.Field("CustomerID").HeaderText("Customer Name").ValueAccessor(valueAccessor).DisableHtmlEncode(false).Width("100").Add(); 

            }).AllowPaging().EditSettings(edit => { edit.AllowAdding(true).AllowEditing(true).AllowDeleting(true).Mode(Syncfusion.EJ2.Grids.EditMode.Normal); }).Toolbar(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" }).PageSettings(page => page.PageCount(2)).Render() 

    ) 

</div> 

 

<script> 

    function valueAccessorFn(field, data, column) { 

        var value = data[field]; 

        var arr = value.split(" "); 

        return arr[0] + "<br>" + arr[1]; 

    } 

 

</script> 

Sample:  https://www.syncfusion.com/downloads/support/forum/155259/ze/155259166347051.zip 

Documentation: https://ej2.syncfusion.com/aspnetmvc/documentation/grid/cell/#displaying-the-html-content 

                              https://ej2.syncfusion.com/aspnetmvc/documentation/grid/columns/#valueaccessor 

Screenshot: 

 

Regards,
Rajapandi R