DEV Community

Neelakandan R
Neelakandan R

Posted on

Spring boot-java-project_calc

Using Html

1) File --> New --> Spring Starter Project
2) Name --> Calculator
3) Select Maven as Type
4) Click Next
5) Add Dependencies: DevTools, Web, Thymeleaf
6) Click Next, Finish
7) Go to src/main/java --> Create a package called com.example.demo.controller
8) Now, right click the newly created package.
9) Create a class -> Calc_Controller
10) Add @Controller annotation
11) Add below content:
@GetMapping("/")
public String show_calculator()
{
return "calc";
}
12) Now, go to src/main/resources --> templates
13) Create a filed named as 'calc.html'

<!DOCTYPE html>
<html xmlns:th="httptp://th:text=" ${results}"www.thymeleaf.org">

<head>
    <title> Calculator</title>

</head>

<body>
    <form action="calculate_values" method="post">
        <label> Number 1: </label>
        <input type="number" name="num1"> <br><br>
        <label> Number 2: </label>
        <input type="number" name="num2"> <br><br>
        <select name="operations">
            <option value="+"> Add </option>
            <option value="-"> Subtract </option>
            <option value="*"> Multiply </option>
            <option value="/"> Divide </option>
        </select>
        <br><br>
        <input type="submit" value="Calculate">
    </form>
    <h2> Result </h2> <br>
    <p> <span th:text="${no1}"> </span>
        <span th:text="${ops}"> </span>
        <span th:text="${no2}"> </span>
        <span> = </span>
        <span th:text="${result}"> </span>
    </p>
</body>

</html>
Enter fullscreen mode Exit fullscreen mode

14) Create Mapping for /calculate_values [action of form]

@RequestParam
Annotation which indicates that a method parameter should be bound to a web request parameter.

15) Create below method in Controller:

package com.example.demo.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;

@Controller
public class calc_controller {
    @GetMapping("/")
    public String show_controller() 
    {
        return "calc";

    }
    @PostMapping("/calculate_values")
    public String claculations(@RequestParam double num1,@RequestParam double num2,@RequestParam String operations,Model model)
    {
        //System.out.println(num1+num2);
        model.addAttribute("no1",num1);
        model.addAttribute("ops",operations);
        model.addAttribute("no2",num2);
        double result=0;
        switch(operations)
        {
        case "+":result=num1+num2;break;
        case "-":result=num1-num2;break;
        case "*":result=num1*num2;break;
        case "/":result=num1/num2;break;
        }
        model.addAttribute("result",result);
        return "calc";

    }

}

Enter fullscreen mode Exit fullscreen mode

http://localhost:8080/calculate_values

Image description

Top comments (0)