Model Binding in Razor Pages

26 Oct 20222 minutes to read

This article deals with the model binding of the Razor Pages of the ASP.NET Core platform. Refer to this Page Model section for the detailed instructions on how to create a page model.

The model binding provides data to the page models and Razor pages. OnGet is a handler method that will be executed once the Razor page gets loaded in the browser. value in the form tag retrieves data from the OnGet method in the IndexModel class using the model binding.

Form Post Back

This sample explains the form post back properties of the rich text editor rendering with the razor page. The Rich text editor is rendered within the form tag and the value post and attribute method has been given into the form tag. Any value into the Request.Form in the OnPost method will be considered as a string and those string should be mapped to the name field of the Rich Text Editor.

@page
@model IndexModel
@{
    ViewData["Title"] = "Home page";
}

@Html.AntiForgeryToken()

<form method="post"> 
    <div class="form-group">
        <ejs-richtexteditor name="comment" id="commentRTE" value="@Model.Value">
        </ejs-richtexteditor>
    </div>

    <br />
    <input type="submit" />
</form>
using Microsoft.AspNetCore.Mvc.RazorPages;

namespace RTE.Pages
{
    public class IndexModel : PageModel // Imported respective page model
    {
        public string Value { get; set; } // value declaration

        public void OnGet()
        {
            this.Value = "<p> Sample text content </p>"; //value Initialization
        }

        public void OnPost()
        {
            var comments = Request.Form["comment"];  //Triggers form action
        }
    }
}