Introduction:

In this article we are going to explain how to create mvc .net core 2.0 application and add model ,view , controller using in visual studio 2017 with example.

Description:

How to create an MVC ASP.Net Core Web Application and add model

Open Visual Studio 2017. Go to File menu, point to new and click New project or click create new project link button on directly start page.

How to Add a model in ASP.NET Core MVC

The "New Project" window will open. You can select an installed template like “.NET Core” in Visual C# Template and then select the Asp.Net Core Web Application (.NET Core). Type project name, such as - MvcCore. Choose the project location path and click OK button. 

How to Add a model in ASP.NET Core MVC

The New ASP.NET Core Web Application (.NET Core) - MvcCore window will open. Select ASP.NET Core version 2.0 in the dropdown box. Select a template as Web Application (Model-View-Controller) and Then, click the OK button.

How to Add a model in ASP.NET Core MVC

Now, you can see MvcCore project structure, as shown in the screenshot given below.

How to Add a model in ASP.NET Core MVC

Create Controller:

In Solution Explorer, go to the Controllers folder, right click it and point to Add, followed by clicking the New Item. 

How to Add a model in ASP.NET Core MVC

Now open a popup window, select controller template and click add button.

 How to Add a model in ASP.NET Core MVC

Now open (Add MVC Controller) popup window, enter controller Name and click add button.

 How to Add a model in ASP.NET Core MVC

Create Model:

In Solution Explorer, go to the Models folder, right click it and point to Add, followed by clicking the class. 

How to Add a model in ASP.NET Core MVC


Now open a popup window, select class template and write class name like “User: and click add button.

 How to Add a model in ASP.NET Core MVC

Copy and paste the below code in User.cs.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
 
namespace MvcCore.Models
{
    public class User
    {
        public int UserID { get; set; }
        public string UserName { get; set; }
        public string UserEmail { get; set; }
        public string UserContact { get; set; }
        public string UserAddress { get; set; }
    }
}

 

Create View:

In Solution Explorer, go to the Views folder, right-click it and point to Add, followed by clicking the New Folder. Then, name the folder as User.

How to Add a model in ASP.NET Core MVC

Again, in Views folder, go to the User folder, right-click it and point to Add, and click to view.

How to Add a model in ASP.NET Core MVC

Now open (Add MVC View) popup window, Enter view name as Index, select template and select model and click Add button.

How to Add a model in ASP.NET Core MVC

Copy and paste the below code into Views/User/Index.cshtml.

@model MvcCore.Models.User
 
@{
    ViewData["Title"]= "View";
    Layout = "~/Views/Shared/_Layout.cshtml";
}
 
<h4>User</h4>
<hr />
<div class="row">
    <div class="col-md-4">
        <form asp-action="View">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-group">
                <label asp-for="UserID" class="control-label"></label>
                <input asp-for="UserID" class="form-control" />
                <span asp-validation-for="UserID" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="UserName" class="control-label"></label>
                <input asp-for="UserName" class="form-control" />
                <span asp-validation-for="UserName" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="UserEmail" class="control-label"></label>
                <input asp-for="UserEmail" class="form-control" />
                <span asp-validation-for="UserEmail" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="UserContact" class="control-label"></label>
                <input asp-for="UserContact" class="form-control" />
                <span asp-validation-for="UserContact" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="UserAddress" class="control-label"></label>
                <input asp-for="UserAddress" class="form-control" />
                <span asp-validation-for="UserAddress" class="text-danger"></span>
            </div>
            <div class="form-group">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </form>
    </div>
</div>
 
<div>
    <a asp-action="Index">Back to List</a>
</div>
 
@section Scripts {
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}

Pressing the F5 or CTRL + F5 button will run the app in debug mode, as shown in the below screenshot.

How to Add a model in ASP.NET Core MVC

I hope you understand now how to create a model in asp.net mvc App using .Net Core 2.0 and Visual Studio 2017.

Please share your valuable feedback or comments to improve my future articles.

 

 

0 comments


Leave a comment

Make sure you enter the (*) required information where indicated. HTML code is not allowed.

you may also like