@* Set the Car class as the View's Model *@
@model MVCWebApp.Models.Car
@*
The addTagHelper
imports the HTML Tag Helpers.
This is imported automatically through the
/Views/_ViewImports.cshtml file.
*@
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
@{
Layout = null;
ViewData["Title"] = "Form Demo - Add New Car";
/*
* This example demonstrates processing a
form using Strongly-Typed View that uses a Car Model
object attached to the View.
* It also uses HTML tag helpers to help
write the HTML for the page.
*
* This View uses two separate Controller
methods to handle the processing of this page. The Controller contains
* two overloaded
"AddCar" methods where one method is used
to deliver the View for user input and the other is used to process the form.
* The Controller's "AddCar()"
method is used to deliver this View to the client to gather user input for the
new car.
* This Controller method passes a Car
object used as the Model for the View.
*
* The View uses the Controller's "AddCar(Car)"
method to process the HTML form. The form controls are bound to
* the public
properties of the Car Model object. The form uses HTTP Post to submit the form
data to the Controller's method.
*/
}
<!DOCTYPE html>
<html>
<head>
<title>Add New Car</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<h1>@ViewData["Title"]</h1>
<h5>
This example demonstrates processing a
form using Strongly-Typed View that uses a Car Model
object attached to the View.
It also uses HTML tag helpers to help
write the HTML for the page.
This View uses two separate Controller
methods to handle the processing of this page. The Controller contains
two overloaded "AddCar" methods where one method is used to deliver
the View for user input and the other is used to process the form.
The Controller's "AddCar()"
method is used to deliver this View to the client to gather user input for the
new car.
This Controller method passes a Car
object used as the Model for the View.
The View uses the Controller's "AddCar(Car)"
method to process the HTML form. The form controls are bound to
the public properties of the Car Model
object. The form uses HTTP Post to submit the form data to the Controller's
method.
</h5>
<br />
<br />
<div class="container">
<h4>Car Information:</h4>
<hr />
@*
The Form Tag Helper is used to setup the submission of the form to the CarsController.
+ asp-controller attribute:
indicates the Controller to use in processing the request.
+ asp-action attribute:
indicates the Controller method to execute and handle the form submission.
+ method attribute:
indicates the form is submitted using an HTTP POST request.
*@
<form asp-controller="Cars" asp-action="AddCar" method="POST">
<div class="form-group">
@* The Form Tag Helpers used to build a label and form
control for the Car class (View's Model) VIN property. *@
<label asp-for="VIN" class="form-label"></label>
<input asp-for="VIN" class="form-control" />
</div>
<div class="form-group">
@* The Form Tag Helpers used to build a label and form
control for the Car class Make property. *@
<label asp-for="Make" class="form-label"></label>
<input asp-for="Make" class="form-control" />
</div>
<div class="form-group">
@* The Form Tag Helpers used to build a label and form
control for the Car class Model property. *@
<label asp-for="Model" class="form-label"></label>
<input asp-for="Model" class="form-control" />
</div>
<div class="form-group">
@* The Form Tag Helpers used to build a label and form
control for the Car class Year property. *@
<label asp-for="Year" class="form-label"></label>
<input asp-for="Year" class="form-control" />
</div>
<div class="form-group">
@* The Form Tag Helpers used to build a label and form
control for the Car class Color property. *@
<label asp-for="Color" class="form-label"></label>
<input asp-for="Color" class="form-control" />
</div>
<div class="form-group">
@* The Form Tag Helpers used to build a label and form
control for the Car class Value property. *@
<label asp-for="Value" class="form-label"></label>
<input asp-for="Value" class="form-control" />
</div>
<div class="form-group">
@* The Form Tag Helper used to build a form control for the
Car class ImageUrl property. *@
<label class="form-label">Car Image (URL):</label>
<input asp-for="ImageUrl" class="form-control" />
</div>
<div class="form-group">
<input type="submit" id="btnSubmit" name="btnSubmit" value="Add Car to Inventory" class="btn btn-primary"/>
</div>
</form>
<hr />
<div class="container">
@ViewData["Message"]
<br />
@* The HTML Tag Helper used to build an anchor tag to
request the CarsController Index method that will
deliver another View (Index.cshtml).
*@
<a asp-controller="Cars" asp-action="Index" >Back to
Home</a>
</div>
</div>
</body>
</html>