날아라김지원
article thumbnail

- form태그

어디로 ,어떻게 보내야 할지 적어줘야한다. 이 from태그를 받는 객체는 DTO라고한다.

클라이언트 -> 서버로 전달하는데 그리고 DTO객체를 새로운 컨트롤러로 조작한다.

action과 method 부분이 전송에 중요한 부분이다. 각각 어디로, 어떻게 보내는지 부분이다.

{{>layouts/header}}}

<form class="container" action="/articles/create" method="post">
<!--    action 어디로, method 어떻게-->
    <div class="mb-3">
        <label class="form-label">subject</label>
        <input type="text" class="form-control">
    </div>
    <div class="mb-3">
        <label class="form-label">content</label>
        <textarea class="form-control" rows="3"></textarea>
    </div>
    <button type="submit" class="btn btn-primary">Submit</button>
</form>

<!--<form action="">-->
<!--    <input type="text">-->
<!--    <textarea></textarea>-->
<!--    <button type="submit">submit</button>-->
<!--</form>-->

{{>layouts/footer}}}

- 폼 데이터 받기

package com.example.first.controller;

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

@Controller
public class ArticleController {

    @GetMapping("/articles/new")
    public String newArticleForm(){
        return "articles/new";
    }

//    post로 받기위함 폼에서 적은 주소 그대로 넣어준다. /articles/create
    @PostMapping("/articles/create")
    public String createArticle(){
        return "";
    }
}

- DTO추가하기 (Data Transfer Object)

데이터 전송 객체 라고 한다. 데이터의 전송을 담당하는 클래스 html의 form 데이터를 가져올 수 있는 그릇을 DTO라고한다. MVC패턴에서 주로 client와 Contorller 사이에서 DTO가 사용된다. DTO를 사용하면 서버와 연결되는 Domain과다르게 필요한 자료만 보낼 수 있고 중요한 자료를 숨겨 보낼 수 있다.

dto/ArticleForm.java

package com.example.first.dto;

public class ArticleForm {

    private String title;
    private String content;

    public ArticleForm(String title, String content) {
        this.title = title;
        this.content = content;
    }

    @Override
    public String toString() {
        return "ArticleForm{" +
                "title='" + title + '\'' +
                ", content='" + content + '\'' +
                '}';
    }
}

- 입력값 이름 주기

아래 코드를 보면 input과 textarea에 name 부분에 title과 content를 넣어줘야 한다.

{{>layouts/header}}

<form class="container" action="/articles/create" method="post">
<!--    action 어디로, method 어떻게-->
    <div class="mb-3">
        <label class="form-label">subject</label>
        <input type="text" class="form-control" name="title">
    </div>
    <div class="mb-3">
        <label class="form-label">content</label>
        <textarea class="form-control" rows="3" name="content"></textarea>
    </div>
    <button type="submit" class="btn btn-primary">Submit</button>
</form>

<!--<form action="">-->
<!--    <input type="text">-->
<!--    <textarea></textarea>-->
<!--    <button type="submit">submit</button>-->
<!--</form>-->

{{>layouts/footer}}

그리고 컨트롤러는 아래와 같이 작성하고

package com.example.first.controller;

import com.example.first.dto.ArticleForm;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;

@Controller
public class ArticleController {

    @GetMapping("/articles/new")
    public String newArticleForm(){
        return "articles/new";
    }

    @PostMapping("/articles/create")
    public String createArticle(ArticleForm form){
//        dto에 있는거냐 물음표 나오면 알트 엔터 무슨 문제였을까?
        System.out.println(form.toString());
        return "";
    }

}

name부분을 채워주지않으면 null값이 전달되게 된다.

 

- 참조

https://e-una.tistory.com/72

profile

날아라김지원

@flykimjiwon

포스팅이 좋았다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!