3
votes

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?

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

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.

1
You want to redirect to the Index page and pass those properties to that Page?jAC
I want to use the values that are in the inputs to display at the bottom of the form after a post request.user6781613
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
not 100% sure but I adding to @jAC answer, change protected for public on the bindable properties.Bart Calixto
@BartCalixto: Indeed, otherwise it's not accessible from the Page, throwing 'Page.Age' is inaccessible due to its protection leveljAC

1 Answers

7
votes

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:

Razor Page Post

Btw.: Properties are written with a capital letter in the beginning.