Arithmetic Operation In ASP.NET MVC

Step1

 

Create an MVC application named "Operation". I named mine "Addition".

Step2

 

By default, Visual Studio created some folders for you, like Controllers, Models, Views etc.

 

Step3

 

Now, go to "Models" folder and create a class file. Here, we define some entities for accessing the values through it and showing the output.

 

Step4

 

Code Ref. For AdditionViewModel.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace Addition.Models {
    public class AdditionViewModel {
        //public int A { get; set; }
        //public int B { get; set; }
        //public int Result { get; set; }
        public double A {
            get;
            set;
        }
        public double B {
            get;
            set;
        }
        public double Result {
            get;
            set;
        }
    }
}

Code Description

 

Here I used three entities to access input values using A and B given by user and show arithmetic operation result using Result variable.

public double A {
            get;
            set;
        }
        public double B {
            get;
            set;
        }
        public double Result {
            get;
            set;
        }

Step5

 

Then, go to "Controllers" folder and create a Controller class file.

Step6

 

Code Ref. For HomeController.cs

using Addition.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace Addition.Controllers {
    public class HomeController: Controller {
        //
        // GET: /Home/
        [HttpGet]
        public ActionResult Index() {
                return View();
            }
            [HttpPost]
        public ActionResult Index(AdditionViewModel model, string command) {
            if (command == "add") {
                model.Result = model.A + model.B;
            }
            if (command == "sub") {
                model.Result = model.A - model.B;
            }
            if (command == "mul") {
                model.Result = model.A * model.B;
            }
            if (command == "div") {
                model.Result = model.A / model.B;
            }
            return View(model);
        }
    }
}

Code Description

 

In action result method I passed one string parameter named command and using this command I assigned some arithmetic operation string value and based on that the operation will be performed.

public ActionResult Index(AdditionViewModel model, string command) {
           if (command == "add") {
               model.Result = model.A + model.B;
           }
           if (command == "sub") {
               model.Result = model.A - model.B;
           }
           if (command == "mul") {
               model.Result = model.A * model.B;
           }
           if (command == "div") {
               model.Result = model.A / model.B;
           }
           return View(model);

Step7

 

Go to "Views" folder and create a folder called "Home" inside which creates a cshtml file named Index.cshtml.

Step8

 

Code Ref. For Index.cshtml

@model Addition.Models.AdditionViewModel
@ {
    Layout = null;
}
@using(Html.BeginForm()) { < fieldset > < legend style = "color:blue" > Operation Of Two Numbers < /legend>
    @Html.EditorFor(x => x.A) < br / > < br / > @Html.EditorFor(x => x.B) < br / > < br / > < input type = "submit"
    value = "add"
    name = "command" / > < input type = "submit"
    value = "sub"
    name = "command" / > < input type = "submit"
    value = "mul"
    name = "command" / > < input type = "submit"
    value = "div"
    name = "command" / > < br / > < br / > < h2 style = "color:red" > @Html.Label("Result is :")
    @Html.DisplayFor(x => x.Result) < /h2> < /fieldset>
}

Code Description

 

To access input values I need textboxes.

@Html.EditorFor(x => x.A) < br / > < br / > @Html.EditorFor(x => x.B)

Here I used reference of controller class that is command and related string values like add , mul , sub and div. The button type is submit.

 

Using multiple submit button type we performed arithmatic operations.

<input type = "submit"
    value = "add"
    name = "command" / > < input type = "submit"
    value = "sub"
    name = "command" / > < input type = "submit"
    value = "mul"
    name = "command" / > < input type = "submit"
    value = "div"
    name = "command" / > < br / > < br / > < h2 style = "color:red" > @Html.Label("Result is :")
    @Html.DisplayFor(x => x.Result)

Finally for showing result output.

@Html.DisplayFor(x => x.Result)

Step9

 

Then, go to "App_Start" folder and open the RouteConfig.cs file to add some code to set the start page when the application will load the first time, like ASP.NET. 

 

Code Ref. For RouteConfig.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Routing;
namespace Addition {
    public class RouteConfig {
        public static void RegisterRoutes(RouteCollection routes) {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
            routes.MapRoute(name: "Default", url: "{controller}/{action}/{id}", defaults: new {
                controller = "Home", action = "Index", id = UrlParameter.Optional
            });
        }
    }
}

Code Description

 

Here the controller name is Home and Controller action method name is Index , if I put new controller action mehod name Index1.

Then the start page should come with ..../Home/Index1 . So , as for now the url must be ..../Home/Index.new

public static void RegisterRoutes(RouteCollection routes) {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
            routes.MapRoute(name: "Default", url: "{controller}/{action}/{id}", defaults: new {
                controller = "Home", action = "Index", id = UrlParameter.Optional
            });

Summary

1. Relationship between Controller , Model , View.
2. By using this application your can perform + , - , * , /  on two numerical.