Razor Pages in ASP.NET Core allow you to build page focused web applications using simple page based programming model. If you worked with Razor Pages before you are probably aware that by default you can handle requests using methods such as OnGet(), OnPost(), OnPut(), and OnDelete(). This means a form POSTed to the server needs to be handled using only one action - OnPost(). At times, however, you need to have multiple actions to deal with the same HTTP verb. A common scenario is when you have multiple submit buttons on a form.
Consider the following example that shows such a form.
As you can see, the Index.cshtml page has three submit buttons housed inside a form. And you want to handle each button different. By default, clicking on any of these three buttons will trigger OnPost() action. How to wire three different handlers instead of the default handler? To accomplish this you need to use the asp-page-handler attribute of the tag helpers. Have a look at the following mark that shows the above form :
<form method="post"> <h2>What kind of yoga classes you are looking for?</h2> <input type="submit" value="Basic Yoga Postures" asp-page-handler="YogaPostures" asp-route-sessioncount="20" /> <br /> <input type="submit" value="Kriya and Meditation" asp-page-handler="Meditation" asp-route-sessioncount="10" /> <br /> <input type="submit" value="Restorative Yoga" asp-page-handler="RestorativeYoga" asp-route-sessioncount="15" /> </form>
Notice the code shown in bold letters. The input elements have asp-page-handler attribute set to certain values. This attribute decides the action from the page model that will be handling the form submission. The asp-page-handler attribute basically emits formaction HTML attribute in the browser. Also notice that the input elements also have asp-route-sessioncount attribute. This attribute sets a route value that is then supplied to the corresponding handler method. Specifying asp-route-* is, of course, optional. Form fields are made available to the handler methods through model binding as usual (also see my earlier article here).
Ok. So far so good. Now it's time to write those handler actions as mentioned in the asp-page-handler attributes. Open the page model class (Index.cshtml.cs) and write the following actions into it :
public void OnPostYogaPostures(int sessionCount) { //do your work here ViewData["message"] = $"Your request for {sessionCount} sessions in Yoga Postures is being processed."; } public void OnPostMeditation(int sessionCount) { //do your work here ViewData["message"] = $"Your request for {sessionCount} sessions in Kriya and Meditation is being processed."; } public void OnPostRestorativeYoga(int sessionCount) { //do your work here ViewData["message"] = $"Your request for {sessionCount} sessions in Restorative Yoga is being processed."; }Notice the action naming convention. Since we want to handle POST requests we prepend all the action names (asp-page-handler name) with "OnPost". Thus we have OnPostYogaPostures, OnPostMeditation, OnPostRestorativeYoga. Also notice that all the handlers have sessionCount parameter. This parameter will come from the asp-route-sessioncount attribute we assigned earlier.
Set a breakpoint in each of these methods and run the application. You will find that clicking on a button takes the control to the corresponding page handler.
That's it for now! Keep coding !!
More