hyeonga_code

파이선 웹구축_장고_36_알림 경고창 팝업 띄우기 본문

Python_Django

파이선 웹구축_장고_36_알림 경고창 팝업 띄우기

hyeonga 2023. 6. 29. 05:59
반응형

- 메세지 띄우기 기능 구현

 

1. 사이트 실행

- messages

info, success, warning, error

messages.[태그](request,[메세지 내용])

 

<acc> > 'views.py'

=====

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
from django.contrib import messages
 
def ulogin(request):
 
    if request.user.is_authenticated:
        return redirect("acc:index")
 
    if request.method == "POST":
        un = request.POST.get("uname")
        up = request.POST.get("upass")
        u = authenticate(username=un, password=up)
        if u:
            login(request, u)
            messages.success(request, f'{u} wellcome!')
            return redirect("acc:index")
        else:
            messages.info(request, 'Not match info')
    return render(request, "acc/login.html")
cs

>> 실행시, 메세지 안 뜸 _ 프론트엔드에서 작성

 

<templates> > 'base.html'

=====

1
2
3
    {% for i in messages %}
        <b>{{i.tags}}</b> {{i.message}}<br>
    {% endfor %}
cs

>>>>>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
{% for i in messages %}
    <div class="alert alert-warning alert-dismissible fade show" role="alert">
    #_ 노란색으로 뜬다
        <strong>{{i.tags}}</strong> {{i.message}}<br>
        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
    </div>
{% endfor %}
    
    
{% for i in messages %}
    <div class="alert alert-{{i.tags}} alert-dismissible fade show" role="alert">
        <strong>{{i.tags}}</strong> {{i.message}}<br>
        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
    </div>
{% endfor %}
 
<style>
    .success{
        background-color: greenyellow;
    }
    .warning{
        background-color: rgba(255,255,0,0.177);
    }
    .info{
        background-color: rgba(0,0,0,0.122);
    }
    .error{
        background-color: rgba(255,0,0,0.124);
    }
    .alert{
        font-size: 20px;
    }
</style>
#_ 상황별로 색상이 바뀌게 됨
cs

 

반응형