# NumericTextBox in Razor Pages

This article describes how to seamlessly integrate and configure the Telerik UI NumericTextBox for ASP.NET Core in Razor Pages applications.

## Referencing Handler Methods in Razor Pages

Razor Pages is an alternative to the MVC pattern that makes page-focused coding easier and more productive. This approach consists of a `cshtml` file and a `cshtml.cs` file (by convention, the two files have the same name).

The `cshtml.cs` file, known as the `PageModel`, contains handler methods that respond to HTTP requests. These methods are prefixed with `On` followed by the HTTP verb (for example, `OnGet`, `OnPost`, `OnPostRead`, `OnPostCreate`).

Handler methods declared in a `PageModel` can be referenced from any Razor Page using one of the following URL patterns:

* Using `Url.Page()`

  ```C#
  Url.Page("PageName", "HandlerName")
  // OR
  Url.Page("/FolderName/PageName", "HandlerName")
  ```

  For example, `Url.Page("Index", "Read")` references the `OnPostRead` or `OnGetRead` handler method in the `Index.cshtml.cs` file.

* Using a query string

  ```C#
  Url("/PathToPage?handler=HandlerName")
  ```

  For example, `Url("/Index?handler=Read")` references the `OnPostRead` or `OnGetRead` handler method in the `Index` page.

For more information on Razor Pages architecture and concepts, refer to [the official Microsoft documentation](https://learn.microsoft.com/en-us/aspnet/core/razor-pages/).

## Binding to a PageModel Property

To bind the NumericTextBox to a property from the `PageModel`, follow the next steps:

1. Declare the `PageModel` at the top of the `RazorPage`:

   ```Razor
       @page
       @model NumericTextBoxBindingModel
   ```

2. Declare the component either in a form or as a stand-alone component:

   ```Razor HtmlHelper
       <form method="post">
           <label for="Price">Price:</label>
           @(Html.Kendo().NumericTextBoxFor(c=>c.Price)
               .Step(1)
               .Min(0)
               .Decimals(0)
           )
           <br />
           <input type="submit" name="name" value="Submit Form" />
       </form>
   ```

   ```Razor TagHelper
       <form method="post">
           <label for="Price">Price:</label>
           <kendo-numerictextbox for="Price" step="1" min="0" decimals="0">
           </kendo-numerictextbox>
           <br />
           <input type="submit" name="name" value="Submit Form" />
       </form>
   ```

3. Bind the property values in the backend:

   ```C#
       public class NumericTextBoxBindingModel : PageModel
       {
           [BindProperty]
           public int Price { get; set; }

           public void OnGet()
           {
               Price = 20; // Assign value to the "Price" property, if needed.
           }
           public void OnPost()
           {
               //omitted for clarity
           }
       }
   ```

For the complete project, refer to the [NumericTextBox in Razor Pages example](https://github.com/telerik/ui-for-aspnet-core-examples/blob/master/Telerik.Examples.RazorPages/Telerik.Examples.RazorPages/Pages/NumericTextBox/NumericTextBoxBinding.cshtml).

## See Also

* [Using Telerik UI for ASP.NET Core in Razor Pages](https://docs.telerik.com/aspnet-core/getting-started/razor-pages#using-telerik-ui-for-aspnet-core-in-razor-pages)
* [Client-Side API of the NumericTextBox](https://www.telerik.com/kendo-jquery-ui/documentation/api/ui/numerictextbox)
* [Server-Side HtmlHelper API of the NumericTextBox](https://www.telerik.com/aspnet-core-ui/documentation/api/numerictextbox)
* [Server-Side TagHelper API of the NumericTextBox](https://www.telerik.com/aspnet-core-ui/documentation/api/taghelpers/numerictextbox)
* [Knowledge Base Section](https://www.telerik.com/aspnet-core-ui/documentation/knowledge-base)