본문 바로가기
코딩/웹페이지 만들기

보이지 않는 input 을 삽입해서 데이터 전달하기

by salzzak 2021. 6. 20.
728x90

edit.ejs

<form action="/edit?_method=PUT" method="POST"> 
        <!-- PUT 은 HTML5 에서는 못씀
            POST 로 쓰되 ?_method=PUT 을 action에 추가해준다.
        -->
      <div class="form-group">
        <label>오늘의 할일</label>
        <input type="text" value="<%= data._id %>" name="id" style="display: none;">
        <input type="text" value="<%= data.제목 %>" class="form-control" name="title">
      </div>
      <div class="form-group">
        <label>날짜</label>
        <input type="text" value="<%= data.날짜 %>" class="form-control" name="date">
      </div>
      <button type="submit" class="btn btn-outline-secondary">Submit</button>
    </form>

 

<input type="text" value="<%= data._id %>" name="id" style="display: none;">

 

이런식으로 값을 전달해줄수 있다. 

 

 

 

// 어떤 사람이 edit 경로로 put 요청을 하면
app.put('/edit', function(요청, 응답){
    // 폼에 담긴 제목/날짜 데이터를 가지고
    // db.collection 에다가 업데이트 함 

    db.collection('feData').updateOne(
        {_id : 요청.body.id }, // id값을 따라서 (나는 전달받은 데이터 중 name이 "id"인 값 받겠다.)
        { $set : {제목 : 요청.body.title , 제목 : 요청.body.date}}, // Operator $set 을 이용해 업데이트 (없으면 추가)
        function(에러,결과){
        // url 파라미터 중 :id 를 가져와주세요.
        // 여기서 id 값을 String 값이기 때문에 정수로 바꾸어주어야한다.
        console.log(결과)
        if(결과==null){
            응답.render('nox.ejs', {data:결과})
        }else{
            응답.render('edit.ejs', {data:결과})
        }
       })    
});

 

요청.body.id > 나는 전달받은 데이터 중 name이 "id"인 값을 받겠다.

 

이런식으로 페이지 / 서버간 데이터 전달이 가능하다.

댓글