This tutorial will teach you how to add two numbers using Spring Boot.
First Step
Select the Template folder.Inside the template folder create index.html page.
index.html
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 | <!DOCTYPE html> <html> <head> <meta charset="ISO-8859-1"> <title>Insert title here</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" > </head> <body> <div class="container"> <div class="row"> <div> <h1>Add Two Numbers</h1> </div> <form th:action="@{addtion}" th:object="${addtion}" method="post"> <div> <label>Num1</label> <input type="text" id="num1" class="form-control" name="num1" > </div> <div> <label>Num2</label> <input type="text" id="num2" class="form-control" name="num2" > </div> </br> <div> <input type="submit" value="submit" /> </div> </form> </div> </div> </body> </html> |
Create the Package Domain
After that select the src/main/java right click the new package create the package name as com.example.FormExampleSpring.domain
After created the package select the package com.example.FormExampleSpring.domain right click and create the class file name Addtion.class
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | public class Addtion { private int num1; private int num2; public int getNum1() { return num1; } public void setNum1(int num1) { this.num1 = num1; } public int getNum2() { return num2; } public void setNum2(int num2) { this.num2 = num2; } public int Total() { return num1 + num2; } } |
After that Create the Controller
AdditionController
After that create the Controller select src/main/java right click new package create the package name as com.example.FormExampleSpring.StudentController
inside the package create the controller as AdditionController.java
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | @Controller public class AdditionController { @GetMapping("/index") public String ViewForm(Model model) { model.addAttribute("Addition", new Addtion()); return "index"; } @PostMapping("/addtion") public String addForm(@ModelAttribute Addtion addtion,BindingResult result,Model model) { model.addAttribute("addtion",addtion); return "calculate"; } } |
After fill the Form click Submit goes to calculate.html and display the total
After that create the calculate.html Page
calculate.html
1 2 3 4 5 6 7 8 9 10 11 | <!DOCTYPE html> <html> <head> <meta charset="ISO-8859-1"> <title>Insert title here</title> </head> <body> <h1>Result</h1> <p th:text="${addtion.Total()}"></p> </body> </html> |
i have attached the video link below. which will do this tutorials step by step.
