"장고 메시지"의 두 판 사이의 차이
둘러보기로 가기
검색하러 가기
(새 문서: == 개요 == 웹사이트에서 살짝 나타났다가 사라지는 메시지. 1회성 알림 메시지 기능이 이미 장고 안에 포함되어 있다. = 기초 사용 = {| class...) |
(차이 없음)
|
2022년 5월 11일 (수) 22:34 판
1 개요
웹사이트에서 살짝 나타났다가 사라지는 메시지. 1회성 알림 메시지 기능이 이미 장고 안에 포함되어 있다.
2 기초 사용
| 과정 | 설명 | 코드 | ||||||
|---|---|---|---|---|---|---|---|---|
| settings.py 수정 | 메시지를 쿠키에서 사용할 것이냐, 세션에서 사용할 것이냐를 지정해준다.
우측 코드 중 하나를 적절한 위치에 추가하면 된다. |
| ||||||
| 뷰 수정 | 실제로 사용할 뷰를 수정해준다.
render 이전에 지정해주면 된다. request와 메시지를 인수로 넣어주면 된다.
|
from django.contrib import messages # 메시지 모듈을 불러오고,
def view...(request):
...
messages.info(request, "비밀번호는 단방향 암호화 되어 보관됩니다.(관리자도 해독을 못한다는 사실!)")
return render(request, 'custom_account/signup.html', {'form': form})
| ||||||
| 탬플릿 수정 | 메세지는 {{ messages }} 안에 담기는데,
메시지는 대부분 모든 페이지에서 쓰이므로 base.html에 작성하는 편이 좋다. |
{% if messages %}
{% for message in messages %}
{% if message.tags %}<li >{{ message }}</li>{% endif %}
{% endfor %}
|
3 더 나아가기
3.1 부트스트랩
https://devlog.jwgo.kr/2020/10/17/fancy-messaging-system-in-django/를 참고하였다.
| 과정 | 설명 | 코드 |
|---|---|---|
| 탬플릿 수정 | 클래스 안에 메시지 태그를 답는다. | {% for message in messages %}
<div class="alert {{ message.tags }} alert-auto-dismissible alert-dismissible notification-container text-center" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
{{ message }}
</div>
{% endfor %}
|
| settings.py 수정 | 메시지 태그가 부트스트랩과 일치하리라 기대하긴 어렵고.. settings에서 지정해준다. | from django.contrib import messages # 메시지를 임포트하는 것도 필요.
MESSAGE_TAGS = {
messages.DEBUG: 'alert-info',
messages.INFO: 'alert-info',
messages.SUCCESS: 'alert-success',
messages.WARNING: 'alert-warning',
messages.ERROR: 'alert-danger',
}
|
| 추가 | 위까지 진행하면 x를 눌러야 사라지는 메시지가 나타나지만, 직접 클릭하지 않고 지워져야 세련된 메시지라 할 수 있을 것이다.
우측 자바스크립트 코드를 탬플릿에 추가하자. |
<script>
window.setTimeout(function() {
$(".alert-auto-dismissible").fadeTo(500, 0).slideUp(500, function(){
$(this).remove();
});
}, 4000); // 초는 여기!
</script>
|