Basic step to learn mvc

Top of Form

  MVC

Bottom of Form

Basic step to learn mvc

MVC is a framework for building web applications using a MVC (Model View Controller) design:

• The Model represents the application core (for instance a list of database records).
• The View displays the data (the database records).
• The Controller handles the input (to the database records).

So creating mvc application follows the step.

Requirements: Visual studio 2010, 2012,2013 and sql server  any version to create the database

in this tutorial i am used database first approach. So  I have created  database  as (dbtesting named)  Then i have created two table(category,Product). So i have finished my database

stuff. Now   I am going to open visual studio and follow the process

  New Project from the Start page, you can use the menu and select File > New Project.)  Then Click New Project, then select Visual C# on the left, then Web and then select ASP.NET  Web Application. Name your project "MvcTestProject" and then click OK.  Then Select Empty  Template. now empty mvc web application  generated in visual studio as shwon in figure given elow

· Right Click on Model Folder

· Select Add and then New Item from the menu.

· In the Add New Item dialog, type Entity in the search box in the upper right hand corner.

· Select ADO.NET Entity Data Model from the filtered list of item templates.

· Change the name of the model to Model.edmx  and click Add.

· In the Choose Model Contents window, select Generate from database and then click the Next button.

· On the Choose Your Data Connection page, select  in the data connection drop down and click Next

As shown in figure 

At last we have created  model as show in figure

The Entity Data Model designer uses a code generator in Visual Studio called the Text Template Transformation Toolkit (T4). Entity Framework will automatically generate category and product table classes

So now we have completed the Model stuff

Second Step :

Creating the Controller Logic An View step by step

The “C” in MVC stands for controller. A controller gathers up data and sends it to a view. In MVC, you can create a controller to act as a repository for a specific class and then have it act as a bridge between your classes and the various views. Our controllers will use the dbtestingEntities retrieve data for us. So follow the process

· In the Solution Explorer, right click the Controllers folder.

· Click Add from its context menu and then Controller.

· In the Add Controller window, change the Controller Name to HomeController  and dropdown "Empty Controller"

· Click the Add button

Check controller class and view added simultaneuously

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.Mvc;

 //using refreence model

using MvcApplication5.Models;

namespace MvcApplication5.Controllers

{

    public class HomeController : Controller

    {

        //

        // GET: /Home/ here

        //  i have created model dbtestingEntities as rpsository(step1)  you can do     database operations

        dbtestingEntities _repositrory = new dbtestingEntities();

        public ActionResult Index()//(we have create strongly type view as list type)

        {

        

            var model = _repositrory.Categories.ToList();//(Here  we get all category from database and pass  )

            return View(model);//( now we have need to create strogly category type view)

        }

    }

}

.

So we have created  index view in home controller .

@model IEnumerableCategory>

           @*here  strongly category type view pass through controller *@

@{

    ViewBag.Title = "Index12";

}

<h2>Index12</h2>

<p>

    @Html.ActionLink("Create New", "Create")

</p>

@*  foreach the loop as shown *@

<table>

    <tr>

        <th>

            @Html.DisplayNameFor(model => model.Name)

        </th>

        <th>

            @Html.DisplayNameFor(model => model.Description)

        </th>

        <th>

            @Html.DisplayNameFor(model => model.IsActive)

        </th>

        <th></th>

    </tr>

@foreach (var item in Model) {

    <tr>

        <td>

            @Html.DisplayFor(modelItem => item.Name)

        </td>

        <td>

            @Html.DisplayFor(modelItem => item.Description)

        </td>

        <td>

            @Html.DisplayFor(modelItem => item.IsActive)

        </td>

        <td>

            @Html.ActionLink("Edit", "Edit", new { id=item.Id }) |

            @Html.ActionLink("Details", "Details", new { id=item.Id }) |

            @Html.ActionLink("Delete", "Delete", new { id=item.Id })

        </td>

    </tr>

}

</table>

So we have display the category in home page .Similar you can add/edit/detete category and products.  So we have created various methods in controller

  public ActionResult Create()

        {

            return View(new Category());

        }

        [HttpPost]

        public ActionResult Create(Category Item)

        {

            _repositrory.Categories.Add(Item);//Simple you can add new record

            return RedirectToAction("Index");//redirect index view

        }

So we have created view

@model MvcApplication5.Models.Category //category type model

@{

    ViewBag.Title = "Create";

}

<h2>Create</h2>

@using (Html.BeginForm()) {

    @Html.AntiForgeryToken()

    @Html.ValidationSummary(true)

    <fieldset>

        <legend>Category</legend>

        <div class="editor-label">

            @Html.LabelFor(model => model.Name)

        </div>

        <div class="editor-field">

            @Html.EditorFor(model => model.Name)

            @Html.ValidationMessageFor(model => model.Name)

        </div>

        <div class="editor-label">

            @Html.LabelFor(model => model.Description)

        </div>

        <div class="editor-field">

            @Html.EditorFor(model => model.Description)

            @Html.ValidationMessageFor(model => model.Description)

        </div>

        <div class="editor-label">

            @Html.LabelFor(model => model.IsActive)

        </div>

        <div class="editor-field">

            @Html.EditorFor(model => model.IsActive)

            @Html.ValidationMessageFor(model => model.IsActive)

        </div>

        <p>

            <input type="submit" value="Create" />

        </p>

    </fieldset>

}

But some time we have show multiple model item in web page .then we have use concept viewmodel . In general word we can say that collection of model classes. We have follow

Various approaches to achieve this( touple ,parital view)