Exercises on Handling a Click Event
- Create an ASP.NET Core application that has a razor page called Index, and that shows an anchor "Click Me!". When the anchor is clicked the anchor should disappear and it should be replaced by the message "I am clicked". Write the entire code in the Index.cshtml razor page - no backing class is to be used.
- The first exercise can also be solved by sending an arbitrary querystring parameter when the anchor link is clicked. The "Request" can be tested for the presence of that parameter in a conditional "if" statement, and accordingly render the message or the anchor. You might have to google about how to send query string parameters with an anchor tag helper. Then you can google about how to read query string parameters in a razor page.
- Another alternative to sending a query string through an anchor tag helper is to send a query string by using an overload of "RedirectToPage". Implement this scheme by redirection from the click event handler.
- Solve Ex. 1 without using the addTagHelpers directive.
Exercises on Form Submit
- Create a FORM of two inputs that, respectively, accept two numbers - say, i and j. The submit event should be handled by the backing class and the sum returned through a query string parameter. Display the sum on the same FORM.
- Create a FORM of two inputs that, respectively, accept two numbers - say, i and j. Display the sum on the same FORM but without using a query string.
- Create a login form of two inputs - UserName and Password. Show a message "Login succeeded" if the user enters UserName as "u", and Password as "p". Otherwise show the message "Invalid credentials". The message should appear somewhere on the same form.
- Create a razor page of two forms on the same page. Each form has one input textbox and a submit button. The first form has a textbox for first name, whereas the second form has a textbox for last name. Initially only the first form is visible. When the user submits the form, the first form hides away and the second form becomes visible. When the user submits the second form, it too is hidden and a message showing the full name should appear instead. Hint: on the basis of what you have learnt so far, you might have to use an input of type="hidden".
This Blog Post/Article "(C# ASP.NET Core) Practice Exercises and Questions on Basic Event Handling in Razor Pages" by Parveen is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.