Spring MVC-데이터 바 인 딩 과 폼 라벨 상세 설명

13988 단어 springmvc폼 태그
데이터 바 인 딩 과 폼 태그
데이터 바 인 딩
데이터 바 인 딩 은 사용자 입력 을 영역 모델 에 연결 하 는 기능 입 니 다.Spring MVC 의 contrller 와 view 데이터 전달 에서 HTTP 요청 특성 을 바탕 으로 모든 HTTP 요청 매개 변수의 유형 은 문자열 입 니 다.모델 영역 에 바 인 딩 해 야 하 는 유형 이 double 또는 int 이면 수 동 으로 형식 변환 이 필요 합 니 다.데이터 바 인 딩 이 있 으 면HTTP 요청 의 String 형식 을 모델 에 필요 한 형식 으로 수 동 으로 변환 할 필요 가 없습니다.데이터 바 인 딩 의 또 다른 장점 은 입력 검증 이 실 패 했 을 때 입력 필드 를 다시 작성 하지 않 아 도 되 는 HTML 폼 을 다시 만 드 는 것 입 니 다.
폼 라 이브 러 리
폼 탭 라 이브 러 리 에는 JSP 페이지 에 HTML 요 소 를 렌 더 링 할 수 있 는 탭 이 포함 되 어 있 습 니 다.이 탭 을 사용 하기 위해 서 는 JSP 페이지 시작 부분 에 taglib 명령 을 설명해 야 합 니 다.

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
폼 태그 라 이브 러 리 에는 input,password,hidden,textarea,checkbox,checkbox,radiobutton,radiobuttons,select,option,options,errors 가 있 습 니 다.폼 라벨 은 acceptCharset,commandName,cssClass,cssStyle,html Escape,model Attribute 등 속성 이 있 습 니 다.
1.input 태그:input 태그 렌 더 링요소 입 니 다.이 탭 의 가장 중요 한 것 은 path 속성 입 니 다.이 필드 는 form backing object 에 연 결 된 속성 을 입력 합 니 다.다음 과 같이 이 input 탭 은 user 대상 의 userName 속성 에 연결 되 어 있 습 니 다. 

<form:form modelAttribute="user" method="post" action="userSave">
  <fieldset>
    <p>
      <label for="name">   :</label>
      <form:input path="userName"/>
    </p>
  </fieldset>
</form:form>
2.password 태그:요 소 를 렌 더 링 합 니 다.password 라벨 은 input 태그 와 비슷 하지만 showPassword 속성 이 있 습 니 다.
3.textare 태그:HTML 의 textarea 요 소 를 렌 더 링 합 니 다.textarea 는 기본적으로 여러 줄 의 입력 을 지원 하 는 input 요소 입 니 다.
4.checkbox 태그:렌 더 링요 소 는 path 속성 을 통 해 데이터 바 인 딩 을 실현 하 는 동시에 checkbox 는 여러 checkbox 요 소 를 렌 더 링 합 니 다.
5.radiobutton 태그 렌 더 링요소,radiobuttons 는 여러 개의 radio 요 소 를 렌 더 링 합 니 다.
6.select 태그:HTML 의 select 요 소 를 렌 더 링 합 니 다.렌 더 링 요소 의 옵션 은 items 속성 을 부여 하 는 Collection,Map,Array 또는 포 함 된 option 이나 options 태그 에서 나 올 수 있 습 니 다.
데이터 바 인 딩 범례
예 를 들 어 데이터 바 인 딩 의 정의 와 장점,그리고 일부 폼 라벨 을 소 개 했 습 니 다.상기 내용 을 더 알 수 있 도록 범례 에서 사용자 류 속성 과 JSP 에서 폼 의 바 인 딩 을 실현 하 는 동시에 JSP 에서 input,password,textarea,checkbox,select 라벨 을 각각 보 여 주 었 습 니 다.
먼저 User 클래스,클래스 에 User 의 속성,그리고 속성 필드 에 대한 get 과 set 방법 을 살 펴 보 겠 습 니 다.

public class User {
  private String userName; //   
  private String password; //  
  private Integer sex;   //  
  private boolean marriage; //    
  private ArrayList<String> hobby;    //    
  private ArrayList<String> contacts;//  
  private String carrer;  //  
  private String houseRegister;  //  
  private String remark;  //    
  public String getRemark() {
    return remark;
  }
  public void setRemark(String remark) {
    this.remark = remark;
  }
  public String getHouseRegister() {
    return houseRegister;
  }
  public void setHouseRegister(String houseRegister) {
    this.houseRegister = houseRegister;
  }
  public String getCarrer() {
    return carrer;
  }
  public void setCarrer(String carrer) {
    this.carrer = carrer;
  }
  public String getUserName() {
    return userName;
  }
  public void setUserName(String userName) {
    this.userName = userName;
  }
  public String getPassword() {
    return password;
  }
  public void setPassword(String password) {
    this.password = password;
  }
  public Integer getSex() {
    return sex;
  }
  public void setSex(Integer sex) {
    this.sex = sex;
  }
  public boolean isMarriage() {
    return marriage;
  }
  public void setMarriage(boolean marriage) {
    this.marriage = marriage;
  }
  public ArrayList<String> getHobby() {
    return hobby;
  }
  public void setHobby(ArrayList<String> hobby) {
    this.hobby = hobby;
  }
  public ArrayList<String> getContacts() {
    return contacts;
  }
  public void setContacts(ArrayList<String> contacts) {
    this.contacts = contacts;
  }
}

Google Controller 클래스 에서 맵 요청 방법 을 정의 합 니 다.userInput 요청 을 처리 하 는 inpuutUser 방법 과 userSave 요청 의 addUser 방법 을 포함 합 니 다.그 중에서 addUser 방법 에서 방향 을 바 꾸 는 데 사 용 됩 니 다.그 중에서@Autowired 주석 을 통 해 ProductController 대상 에 UserService 대상 을 주동 적 으로 주입 하여 user 대상 에 대한 저장 과 조회 등 작업 을 실현 합 니 다.model 의 addAttribute 방법 을 통 해 User 클래스 대상,HashMap 유형의 hobby 대상,String[]유형의 carrers 대상 을 View(JSP)에 전달 합 니 다.코드 는 다음 과 같 습 니 다.

@Controller
public class ProductController {
  private static final Log logger = LogFactory.getLog(ProductController.class);
  
  @Autowired
  private UserService userService;
  
  @RequestMapping(value="/userInput")
  public String inputUser(Model model){
    HashMap<Integer, String> hobbys = new HashMap<Integer, String>();
    hobbys.put(1, "  ");
    hobbys.put(2, "   ");
    hobbys.put(3, "  ");
    hobbys.put(4, "  ");
    model.addAttribute("user", new User());
    model.addAttribute("hobbys", hobbys);
    model.addAttribute("carrers",new String[]{"  ","  ","  ","IT  ","  "});
    return "UserAdd";
  }
  @RequestMapping(value="/userSave")
  public String addUser(@ModelAttribute User user){
    userService.addUser(user);
    return "redirect:/userList";
  }
  @RequestMapping(value="/userList")
  public String listUsers(Model model){
    List<User> users = userService.getUsers();
    model.addAttribute("users", users);
    return "UserList";
  }
}

또한,중국어 난호 문 제 를 피하 기 위해 서 는 웹.xml 파일 에 인 코딩 필 터 를 추가 해 야 합 니 다.또한 JSP 페이지 인 코딩 은 UTF-8 로 설정 되 어 있 습 니 다.form 폼 의 제출 방식 은 post 여야 합 니 다.웹.xml 파일 의 설정 정 보 를 먼저 보 겠 습 니 다.

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5">
 <servlet>
   <servlet-name>springmvc</servlet-name>
   <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
   <init-param>
     <param-name>contextConfigLocation</param-name>
     <param-value>/WEB-INF/config/springmvc-config.xml</param-value>
   </init-param>
   <load-on-startup>1</load-on-startup>
 </servlet>
 <servlet-mapping>
   <servlet-name>springmvc</servlet-name>
   <url-pattern>/</url-pattern>
 </servlet-mapping>
 <!--        -->
 <filter> 
    <filter-name>characterEncodingFilter</filter-name> 
    <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class> 
    <init-param> 
      <param-name>encoding</param-name> 
      <param-value>UTF-8</param-value> 
    </init-param> 
    <init-param> 
      <param-name>forceEncoding</param-name> 
      <param-value>true</param-value> 
    </init-param> 
  </filter> 
  <filter-mapping> 
    <filter-name>characterEncodingFilter</filter-name> 
    <url-pattern>/*</url-pattern> 
  </filter-mapping> 
</web-app>

UserAddJSP 파일 형식 은 다음 과 같 습 니 다.그 중에서 Map 형식의 hobby 를 checkboxes 에 연결 하고 String[]형식의 carrer 를 select 에 연결 하여 option 탭 을 통 해 select 에 옵션 을 추가 하 는 동시에 method 방법 은 post 로 지정 하여 중국어 난동 문 제 를 피해 야 합 니 다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
  pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Add a User</title>
</head>
<body>
<div id="global">
<form:form modelAttribute="user" method="post" action="userSave">
  <fieldset>
    <legend>Add a User</legend>
    <p>
      <label>   :</label>
      <form:input path="userName"/>
    </p>
    <p>
      <label>  :</label>
      <form:password path="password"/>
    </p>
    <p>
      <label>  :</label>
      <form:checkbox path="marriage" value="  "/>
    </p>
    <p>
      <label>  :</label>
      <form:checkboxes items="${hobbys}" path="hobby"/>
    </p>
    <p>
      <label>  :</label>
      <form:checkbox path="contacts" value="  "/>  
      <form:checkbox path="contacts" value="  "/>  
      <form:checkbox path="contacts" value="  "/>  
      <form:checkbox path="contacts" value="  "/>  
    </p>
    <p>
      <label>  :</label>
      <form:select path="carrer"> 
        <option/>     
        <form:options items="${carrers }"/>
      </form:select>
    </p>
    <p>
      <label>  :</label>
      <form:select path="houseRegister">
        <option>     </option>
        <option value="1">  </option>
        <option value="2">  </option>
        <option value="3">  </option>
        <option value="4">  </option>
        <option value="5">  </option>
      </form:select>
    </p>
    <p>
      <label>    :</label>
      <form:textarea path="remark" rows="5"/>
    </p>
    <p id="buttons">
      <input id="reset" type="reset">
      <input id="submit" type="submit" value="Add User">
    </p>
  </fieldset>
</form:form>
</div>
</body>
</html>
UserList.JSP 파일 은 저 장 된 user 정 보 를 옮 겨 다 니 며 보 여 줍 니 다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
  pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<div id="global">
  <h1>User List</h1>
  <a href="<c:url value="/userInput"/>">Add User</a>
  <table>
    <tr>
      <th>   </th>
      <th>  </th>
      <th>  </th>
      <th>  </th>
      <th>    </th>
      <th>  </th>
      <th>  </th>
      <th>  </th>
      <th>    </th>
    </tr>
    <c:forEach items="${users }" var="user">
      <tr>
        <td>${user.userName }</td>
        <td>${user.password }</td>
        <td>${user.sex }</td>
        <td>${user.marriage }</td>
        <td>${user.hobby }</td>
        <td>${user.contacts }</td>
        <td>${user.carrer }</td>
        <td>${user.houseRegister }</td>
        <td>${user.remark }</td>
      </tr>
    </c:forEach>
  </table>
</div>
</body>
</html>
이 공 사 는 지난 공사 에서 추 가 된 것 이기 때문에 다른 배치 파일 은 이전 공사 와 마찬가지 로 더 이상 군말 을 하지 않 으 니 독자 들 의 양 해 를 바 랍 니 다.
이 프로그램 을 실행 하여 브 라 우 저 에 입력 하 십시오.http://localhost:8081/SpringMVC/userInput왼쪽 그림 을 볼 수 있 고 양식 작성 이 완료 되 었 습 니 다.Add User 단 추 를 누 르 면 오른쪽 그림 의 출력 정 보 를 볼 수 있 습 니 다.독자 가 출력 정보 에 문제 가 있 는 지 모 르 겠 습 니 다.취 미 는[1]이 고 호적 도 1 이 며 출력 은 폼 에서 선택 한 색인 위치 입 니 다.그리고 보험증서 에서 사용자 의 성별 을 지정 하 는 것 을 잊 어 버 려 입력 성별 이 비어 있 는 것 같 습 니 다.이런 문 제 는 본 고의 부주의 로 인해 발생 한 것 으로 관심 이 있 는 독자 들 은 이 블 로그 에 대해 더욱 완선 한 수정 을 할 수 있다.
 

이상 이 바로 본 고의 모든 내용 입 니 다.여러분 의 학습 에 도움 이 되 고 저 희 를 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.

좋은 웹페이지 즐겨찾기