Spring MVC — создание регистрационной формы с использованием библиотеки тегов форм

Опубликовано: 5 Октября, 2022

Spring Framework предоставляет библиотеку тегов формы Spring для представлений JSP в среде Spring Web MVC. В Spring Framework мы используем Java Server Pages (JSP) в качестве компонента представления для взаимодействия с пользователем. Начиная с версии 2.0, Spring Framework предоставляет полный набор тегов, поддерживающих привязку данных. Эти теги используются для обработки элементов формы при использовании JSP и Spring Web MVC. Каждый тег в библиотеке тегов обеспечивает поддержку набора атрибутов соответствующего аналога HTML-тега, что делает теги знакомыми и интуитивно понятными в использовании. Эти теги отображают HTML-тег, совместимый с HTML 4.01/XHTML 1.0. Библиотека тегов формы Spring интегрирована с Spring Web MVC. Это дает тегу доступ к объекту команды и справочным данным, с которыми имеет дело контроллер. Реализация всех тегов в библиотеке тегов Spring доступна в пакете org.springframework.web.servlet.tags.form в Spring API.

Refer to this article to read in detail: Spring MVC – Form Tag Library

Итак, в этой статье мы собираемся создать регистрационную форму, используя библиотеку тегов форм. Мы собираемся использовать следующий компонент для разработки нашей страницы регистрации.

  • Spring MVC — текстовое поле формы
  • Spring MVC — пароль
  • Spring MVC — раскрывающийся список формы
  • Spring MVC — флажок формы
  • Spring MVC — радиокнопка формы

Образец изображения приведен ниже, чтобы получить представление о том, что мы собираемся делать в этой статье.

Пример проекта

Настройка проекта

Мы собираемся использовать Spring Tool Suite 4 IDE для этого проекта. Пожалуйста, обратитесь к этой статье, чтобы установить STS на свой локальный компьютер. Как загрузить и установить среду IDE Spring Tool Suite (Spring Tools 4 для Eclipse)? Перейдите в среду IDE STS, затем создайте новый проект maven, выберите «Файл» > «Создать» > «Проект Maven» и выберите следующий архетип, как показано на изображении ниже, следующим образом:

Добавьте следующие зависимости maven и подключаемый модуль в файл yourpom.xml.

<!-- https://mvnrepository.com/artifact/org.springframework/spring-webmvc -->
<dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-webmvc</artifactId>
    <version>5.3.18</version>
</dependency>

<!-- https://mvnrepository.com/artifact/javax.servlet/javax.servlet-api -->
<dependency>
    <groupId>javax.servlet</groupId>
    <artifactId>javax.servlet-api</artifactId>
    <version>4.0.1</version>
    <scope>provided</scope>
</dependency>

<!-- plugin -->
<build>
    <plugins>
        <plugin>
            <groupId>org.apache.maven.plugins</groupId>
            <artifactId>maven-war-plugin</artifactId>
            <version>2.6</version>
            <configuration>
                <failOnMissingWebXml>false</failOnMissingWebXml>
            </configuration>
        </plugin>
    </plugins>
</build>

Ниже приведен полный код файла pom.xml после добавления этих зависимостей.

Файл: pom.xml

XML




<project xmlns="http://maven.apache.org/POM/4.0.0"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <groupId>com.geeksforgeeks</groupId>
    <artifactId>simple-calculator</artifactId>
    <packaging>war</packaging>
    <version>0.0.1-SNAPSHOT</version>
    <name>simple-calculator Maven Webapp</name>
    <url>http://maven.apache.org</url>
    
    <dependencies>
        <dependency>
            <groupId>junit</groupId>
            <artifactId>junit</artifactId>
            <version>3.8.1</version>
            <scope>test</scope>
        </dependency>
        
        <!-- https://mvnrepository.com/artifact/org.springframework/spring-webmvc -->
        <dependency>
            <groupId>org.springframework</groupId>
            <artifactId>spring-webmvc</artifactId>
            <version>5.3.18</version>
        </dependency>
        
        <!-- https://mvnrepository.com/artifact/javax.servlet/javax.servlet-api -->
        <dependency>
            <groupId>javax.servlet</groupId>
            <artifactId>javax.servlet-api</artifactId>
            <version>4.0.1</version>
            <scope>provided</scope>
        </dependency>
    </dependencies>
    
    <build>
        <finalName>simple-calculator</finalName>
        <plugins>
            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-war-plugin</artifactId>
                <version>2.6</version>
                <configuration>
                    <failOnMissingWebXml>false</failOnMissingWebXml>
                </configuration>
            </plugin>
        </plugins>
    </build>
</project>

Настройка диспетчерского сервлета
Прежде чем перейти к части кодирования, давайте посмотрим на структуру файла на изображении ниже.
Note: Please refer to the green color box files. Other files are not present in this project. 
Итак, сначала создайте папку src/main/java и внутри этой папки создайте класс с именем CalculatorAppIntilizer и поместите его в пакет com.geeksforgeeks.calculator.config и расширите класс AbstractAnnotationConfigDispatcherServletInitializer . Обратитесь к изображению ниже.
И всякий раз, когда вы расширяете этот класс, у него есть некоторые предабстрактные методы, которые нам нужны для реализации. Теперь внутри этого класса нам нужно просто написать две строки кода для настройки сервлета Dispatcher. Перед этим мы должны создать еще один класс для файла конфигурации Spring. Итак, перейдите в папку src/main/java и внутри этой папки создайте класс с именем CalculatorAppConfig и поместите его в пакет com.geeksforgeeks.calculator.config . Ниже приведен код файла CalculatorAppConfig.java .
Файл: CalculatorAppConfig.java
Java



package com.geeksforgeeks.calculator.config;
  
import org.springframework.context.annotation.ComponentScan;
import org.springframework.context.annotation.Configuration;
  
@Configuration
@ComponentScan(basePackages = "com.geeksforgeeks.calculator.controllers")
public class CalculatorAppConfig {
  
}
Ниже приведен полный код файла CalculatorAppIntilizer.java . Комментарии добавляются внутри кода, чтобы понять код более подробно.
Файл: CalculatorAppIntilizer.java
Java



package com.geeksforgeeks.calculator.config;
  
import org.springframework.web.servlet.support.AbstractAnnotationConfigDispatcherServletInitializer;
  
public class CalculatorAppIntilizer extends AbstractAnnotationConfigDispatcherServletInitializer {
  
    @Override
    protected Class<?>[] getRootConfigClasses() {
        // TODO Auto-generated method stub
        return null;
    }
  
    // Registering the Spring config file
    @Override
    protected Class<?>[] getServletConfigClasses() {
        Class aClass[] = { CalculatorAppConfig.class };
        return aClass;
    }
  
    // Add mapping url
    @Override
    protected String[] getServletMappings() {
        String arr[] = { "/geeksforgeeks.org/*" };
        return arr;
    }
  
}
Настройка ViewResolver
Spring MVC — это Web MVC Framework для создания веб-приложений. В общем, все фреймворки MVC предоставляют способ работы с представлениями. Spring делает это с помощью ViewResolvers, что позволяет отображать модели в браузере, не привязывая реализацию к конкретной технологии представления. Подробнее читайте здесь: ViewResolver в Spring MVC. Итак, для настройки ViewResolver перейдите в файл CalculatorAppConfig.java и запишите код следующим образом.
@Bean
public InternalResourceViewResolver viewResolver() {
        InternalResourceViewResolver viewResolver = new InternalResourceViewResolver();
        viewResolver.setPrefix("/WEB-INF/view/");
        viewResolver.setSuffix(".jsp");
        return viewResolver;
    }
А ниже обновленный код файла CalculatorAppConfig.java после написания кода для настройки ViewResolver.
Файл: Обновленный CalculatorAppConfig.java
Java



package com.geeksforgeeks.calculator.config;
  
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.ComponentScan;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.ViewResolver;
import org.springframework.web.servlet.config.annotation.EnableWebMvc;
import org.springframework.web.servlet.view.InternalResourceViewResolver;
  
@EnableWebMvc
@Configuration
@ComponentScan(basePackages = "com.geeksforgeeks.calculator.controllers")
public class CalculatorAppConfig {
  
    // setup ViewResolver
    @Bean
    public InternalResourceViewResolver viewResolver() {
        InternalResourceViewResolver viewResolver = new InternalResourceViewResolver();
        viewResolver.setPrefix("/WEB-INF/view/");
        viewResolver.setSuffix(".jsp");
        return viewResolver;
    }
  
}
Создать DTO
Сначала нам нужно создать класс DTO. Итак, перейдите в папку src/main/java и внутри этой папки создайте класс с именем UserRegistrationDTO и поместите его в пакет com.geeksforgeeks.calculator.dto . Ниже приведен код файла UserRegistrationDTO.java . Комментарии добавляются внутри кода, чтобы понять код более подробно.
Файл: UserRegistrationDTO.java
Java



package com.geeksforgeeks.calculator.dto;
  
public class UserRegistrationDTO {
  
    private String name;
    private String userName;
    private char[] password;
    private String branch;
    private String skills;
    private String gender;
  
    public String getName() {
        return name;
    }
  
    public void setName(String name) {
        this.name = name;
    }
  
    public String getUserName() {
        return userName;
    }
  
    public void setUserName(String userName) {
        this.userName = userName;
    }
  
    public char[] getPassword() {
        return password;
    }
  
    public void setPassword(char[] password) {
        this.password = password;
    }
  
    public String getBranch() {
        return branch;
    }
  
    public void setBranch(String branch) {
        this.branch = branch;
    }
  
    public String getSkills() {
        return skills;
    }
  
    public void setSkills(String skills) {
        this.skills = skills;
    }
  
    public String getGender() {
        return gender;
    }
  
    public void setGender(String gender) {
        this.gender = gender;
    }
  
}
Создать контроллер
Перейдите в папку src/main/java и внутри этой папки создайте класс RegistrationController и поместите его в пакет com.geeksforgeeks.calculator.controllers . Ниже приведен код файла RegistrationController.java .
Файл: Файл RegistrationController.java
Java



package com.geeksforgeeks.calculator.controllers;
  
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.RequestMapping;
  
import com.geeksforgeeks.calculator.dto.UserRegistrationDTO;
  
@Controller
public class RegistrationController {
      
    @RequestMapping("/register")
    public String showRegistrationPage(@ModelAttribute("userRegInfo") UserRegistrationDTO userRegistrationDTO) {
        return "registration-page";
    }
      
}
Reference article: Spring MVC @ModelAttribute Annotation with Example  
Создать представление
Теперь нам нужно создать представление с именем «register -page » внутри папки WEB-INF/view с расширением .jsp . Итак, перейдите в src > main > webapp > WEB-INF и создайте представление папки, а внутри этой папки создайте файл jsp с именем Registration-page . Итак, ниже приведен код файла Registration-page.jsp . Комментарии добавляются внутри кода, чтобы понять код более подробно.
Файл: Registration-page.jsp
HTML



<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
  
<html>
<body>
  
    <h1 align="center">Create Registration Form using Form Tag in Spring MVC</h1>
          
    <form:form modelAttribute="userRegInfo"> 
      
    <div align="center">
      
    <!-- A Simple Input Field -->
    <label>Name : </label>
    <form:input path="name"/>
      
    <br/>
      
    <label>User Name : </label>
    <form:input path="userName"/>
      
    <br/>
      
    <label>Password : </label>
    <form:password path="password"/>
      
    <br/>
      
    <!-- DropDown Field -->
    <label>Branch : </label>
    <form:select path="branch">
&nb
            

                            

                    
                                            Java
                                    

                        

                
РЕКОМЕНДУЕМЫЕ СТАТЬИ

                

                                            

                            
JUnit — написание примеров тестовых случаев для StudentService на Java

                            
24 Февраля, 2023

                        

                                            

                            
Как сканировать все файлы MP3 в данном каталоге с помощью Java?

                            
23 Февраля, 2023

                        

                                            

                            
Что такое графика Java AWT?

                            
23 Февраля, 2023

                        

                                            

                            
Каковы негативные аспекты наследования класса Java Stack от Vector?

                            
23 Февраля, 2023

                        

                                            

                            
Как скопировать текст в буфер обмена в Java?

                            
22 Февраля, 2023

                        

                                            

                            
MapmyIndia Android SDK — добавление многоугольника на карту

                            
22 Февраля, 2023

                        

                                            

                            
Модульное тестирование, интеграционное тестирование, приоритетное тестирование с использованием TestNG в Java

                            
22 Февраля, 2023

                        

                                            

                            
MapmyIndia Android SDK — добавление полилиний на карту

                            
22 Февраля, 2023