팀프로젝트 진행사항
<script>
function update_profile() {
let name = $('#name').val()
let blog = $('#blog').val()
let mbti = $('#mbti').val()
let desc = $('#desc').val()
let img = $('#img').val()
let merit = $('#merit').val()
var data = {
"name": name,
"blog":blog,
"mbti":mbti,
"desc":desc,
"img":img,
"merit":merit
}
var jsonData = JSON.stringify(data);
fetch("/update/{{ member_id['_id'] }}", {
method:'PUT',
headers:{'content-type':'application/json'},
body:jsonData
}).then((res) => res.json()).then((data) => {
alert(data['msg'])
location.reload()
})
}
</script>
<body>
<div class="container">
<div class>
<div class="input-group mb-3">
<label class="input-group-text" for="size">사진</label>
<input id="img" type="url" class="form-control" />
</div>
<div class="input-group mb-3">
<span class="input-group-text">이름</span>
<input id="name" value="{{ member['name']}}" class="form-control" />
</div>
<div class="input-group mb-3">
<span class="input-group-text">블로그 주소</span>
<input id="blog" value="{{ member['blog']}}" class="form-control" />
</div>
<div class="input-group mb-3">
<label class="input-group-text" for="size">MBTI</label>
<input id="mbti" value="{{ member['mbti']}}" type="text" class="form-control" />
</div>
<div class="input-group mb-3">
<label class="input-group-text" for="size">장점</label>
<input id="merit" value="{{ member['merit']}}" type="text" class="form-control" />
</div>
<div class="input-group mb-3">
<label class="input-group-text" for="size">자기소개</label>
<input id="desc" value="{{ member['desc']}}" type="text" class="form-control" />
</div>
</div>
<div class="d-flex justify-content-around">
<button type="button" onClick="update_profile()" class="btn btn-light">수정</button>
<a href="/view/{{ member_id['_id'] }}"><button class="btn btn-light">취소</button></a>
</div>
</div>
</body>@app.route("/update/<id>", methods=["PUT"])
def update_post(id):
receive = request.get_json()
name_receive = receive['name']
blog_receive = receive['blog']
mbti_receive = receive['mbti']
img_receive = receive['img']
desc_receive = receive['desc']
merit_receive = receive['merit']
doc = {
'name':name_receive,
'blog':blog_receive,
'mbti':mbti_receive,
'img':img_receive,
'merit':merit_receive,
'desc':desc_receive
}
db.members.update_one({'_id': ObjectId(id)},{'$set':doc})
return jsonify({'msg':'수정완료!'})어제 FormData로 시도했다가 실패해서 데이터를 JSON으로 변환해서 시도해봤더니 잘 작동했다.
- JSON.stringify(): JavaScript 객체를 JSON 문자열로 변환해준다.
- request.get_json() : JSON 형식으로 전달된 요청 본문은 flask에서 request.get_json() 함수로 받을 수 있다.
'TIL > WEEK1' 카테고리의 다른 글
| WEEK 1. 드디어 첫 프로젝트 끝! (0) | 2023.05.19 |
|---|---|
| WEEK1. POST와 PUT의 차이점 (0) | 2023.05.18 |
| WEEK1. REST API (0) | 2023.05.16 |
| WEEK1. Git (0) | 2023.05.15 |