Passing data from view to controller asp.net core razor pages

Question

I am trying to create a simple asp.net core razor web site.

I have a .cshtml page:

@page

@using RazorPages

@model IndexModel

@using (Html.BeginForm()) {
  <label for="age">How old are you?</label>
  <input type="text" asp-for="age">
  <br/>
  <label for="money">How much money do you have in your pocket?</label>
  <input type="text" asp-for="money">
  <br/>
  <input type="submit" id="Submit">
}

and a .cs file:

using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using System;
using System.Threading.Tasks;

namespace RazorPages
{
  public class IndexModel : PageModel
  {
    protected string money { get; set; }
    protected string age { get; set; }
    public IActionResult OnPost()
    {
      if (!ModelState.IsValid)
      {
        return Page();
      }

  

      return RedirectToPage("Index");

    }
  }
}

I want to be able to pass age and money to the cs file and then pass it back to the .cshtml file in order to display it on the page after the submit button sends a get request. How can I implement this?

The following index.cshtml.cs code does not work:

using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using System;
using System.Threading.Tasks;

namespace RazorPages
{
  public class IndexModel : PageModel
  {
    [BindProperty]
    public decimal Money { get; set; }
    [BindProperty]
    public int Age { get; set; }
    public IActionResult OnPost()
    {
 /*     if (!ModelState.IsValid)
      {
        return Page();
      }*/
    this.Money = Money;
    this.Age = Age;
  
 System.IO.File.WriteAllText(@"C:\Users\Administrator\Desktop\murach\exercises\WriteText.txt", 
this.Money.ToString());
return RedirectToPage("Index", new { age = this.Age, money = this.Money});

    }
  }
}

and index.cshtml:

@page
@using RazorPages


@model IndexModel

@using (Html.BeginForm()) {
  <label for="Age">How old are you?</label>
  <input type="text" asp-for="Age">
  <br/>
  <label for="Money">How much money do you have in your pocket?</label>
  <input type="text" asp-for="Money">
  <br/>
  <input type="submit" id="Submit">


}
Money: @Model.Money
Age: @Model.Age

Money and age show up as 0s on the page and file regardless of what you type in.

You want to redirect to the Index page and pass those properties to that Page? — jAC
– jAC, Commented Aug 25, 2017 at 0:35
I want to use the values that are in the inputs to display at the bottom of the form after a post request. — user6781613
– user6781613, Commented Aug 25, 2017 at 0:40
OK, I added my answer. Be careful: Right now, you're redirecting if the ModelState is valid, which means you'll get redirected onPost. — jAC
– jAC, Commented Aug 25, 2017 at 0:42
not 100% sure but I adding to @jAC answer, change protected for public on the bindable properties. — Bart Calixto
– Bart Calixto, Commented Aug 25, 2017 at 0:54
@BartCalixto: Indeed, otherwise it's not accessible from the Page, throwing 'Page.Age' is inaccessible due to its protection level — jAC
– jAC, Commented Aug 25, 2017 at 0:57

TylerH · Accepted Answer · 2025-01-20 20:48:44Z

7

Append your .cshtml file with code that outputs the values you're filling via POST.

MyPage.cshtml

@page
@model IndexModel  
@using (Html.BeginForm())
{
    <label for="Age">How old are you?</label>
    <input type="text" asp-for="Age">
    <br />
    <label for="Money">How much money do you have in your pocket?</label>
    <input type="text" asp-for="Money">
    <br />
    <input type="submit" id="Submit">  
}
Money: @Model.Money
Age: @Model.Age

Now add [BindProperty] to each property in your model, which you want to update from your OnPost():

[BindProperty]
public int Age { get; set; }
[BindProperty]
public decimal Money { get; set; }

Furthermore, as Bart Calixto pointed out, those properties have to be public in order to be accessible from your Page.

The OnPost() method is really simple, since ASP.NET Core is doing all the work in the background (thanks to the binding via [BindProperty]).

public IActionResult OnPost()
{
    return Page();
}

So now, you can click on Submit and voila, the page should look like this:

By the way, properties are written with a capital letter in the beginning.

edited Jan 20 at 20:48

TylerH

21.3k84 gold badges84 silver badges122 bronze badges

answered Aug 25, 2017 at 0:41

jAC

5,3256 gold badges43 silver badges57 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

jAC Over a year ago

As a small info: return RedirectToPage("SomeOtherPage", new { age = this.Age, money = this.Money}); has been there in case you wanted to redirect this info to another page.

user6781613 Over a year ago

I am using an empty web site template. Your example is using a razor page template

jAC Over a year ago

Your example is also using Razor Pages. You tagged this post with razor-pages, your title contains razor pages and your code is a razor page (@page). What do you mean by empty web site template?

user6781613 Over a year ago

My code was missing the renderbody() function and the layout.cshtml, viewimports etc...

Collectives™ on Stack Overflow

Passing data from view to controller asp.net core razor pages

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related