Render the RichTextEditorFor control

1 Mar 20223 minutes to read

The RichTextEditorFor control can be rendered by passing values from the controller. The formatted Rich Text Editor value is retrieved when submitting the form using the post method.

In the following sample, the RichTextEditorFor control is rendered.

CSHTML
Controller.cs
@model EJ2MVCSampleBrowser.Controllers.RichTextEditorModel
@using (Html.BeginForm()) {
    @Html.ValidationSummary(true)
    <div class="col-lg-12 control-section">
        <div style='padding-top:40px;'>
            <div id="wrapper">
                @Html.EJS().RichTextEditorFor(model => model.Value).Render()
                <div id="errorMessage">
                    @Html.ValidationMessageFor(model => model.Value)
                </div>
                <div id="submitbutton">
                    @Html.EJS().Button("btn").Content("Submit").Render()
                </div>
            </div>
        </div>
    </div>
}
<style>
    #submitbutton {
        margin: 10px auto;
        text-align: center;
    }

    #errorMessage {
        color: red;
    }
</style>
using System.ComponentModel.DataAnnotations;
public class RichTextEditorModel
    {
        [Required(ErrorMessage = "Value is required")]
        // Specify AllowHtml attribute on MVC application alone
        [AllowHtml]
        public string Value { get; set; }
    }
    public partial class HomeController : Controller
    {
        RichTextEditorModel rteModel = new RichTextEditorModel();
        public ActionResult RichTextEditorFor()
        {
            rteModel.Value = "<p>Type or edit the content to post the <b>Rich Text Editor</b> value.</p>";
            return View(rteModel);
        }
        [HttpPost]
        public ActionResult RichTextEditorFor(RichTextEditorModel model)
        {
            rteModel.Value = model.Value;
            return View(rteModel);
        }
    }

The output will be as follows.

RichTextEditorFor