上節(jié)說到views.py里login_form = LoginForm(request.POST)是一個LoginForm的實(shí)例拍霜,里面包含對users和password的要求。再把request.POST傳進(jìn)去進(jìn)行檢驗(yàn)以確定是否符合要求薪介。login_form里面有個errors屬性祠饺,如果不符合則里面會存儲不符合的原因。login_form.is_valid()檢查errors是否為空汁政,如果為空則符合條件道偷,is_valid()為True,然后再進(jìn)行接下來的檢驗(yàn)看密碼和賬號匹配否记劈。
現(xiàn)在想實(shí)現(xiàn)對用戶輸入錯誤信息提示的功能勺鸦,可以利用errors,如果不符合條件目木,則把errors里的錯誤原因顯示在前端换途,且把輸入錯誤的輸入框用紅框focus。這需要把后臺變量傳遞到前端。
class LoginView(View): #這樣就不用做POST和GET的判斷了怀跛,django根據(jù)情況自己調(diào)用
def get(self,request):
return render(request, "login.html", {})
def post(self,request):
login_form = LoginForm(request.POST) #前端的html文件中變量名必須和forms里定義的兩個名字相同才能自動檢查
if login_form.is_valid(): #is_valid檢查login_form的error是否為空距贷,為空則滿足條件
user_name = request.POST.get("username", "")
pass_word = request.POST.get("password", "")
user = authenticate(username=user_name, password=pass_word)
if user is not None:
login(request, user)
return render(request,"index.html")
else:
return render(request, "login.html", {"msg": "用戶名或密碼錯誤"})
else:
return render(request, "login.html", {"login_form":login_form})
這樣login_form和msg都傳了。先檢查符合條件不吻谋,如不符合則顯示errors忠蝗。如果符合再檢查密碼對不對,如不對則提示msg漓拾。login.html的表單里:
<form action="/login/" method="post" autocomplete="off">
<input type='hidden' name='csrfmiddlewaretoken' value='mymQDzHWl2REXIfPMg2mJaLqDfaS1sD5' />
<div class="form-group marb20 {% if login_form.errors.username %}errorput{% endif %}">
<label>用 戶 名</label>
<input name="username" id="account_l" type="text" placeholder="手機(jī)號/郵箱" />
</div>
<div class="form-group marb8 {% if login_form.errors.password %}errorput{% endif %}">
<label>密 碼</label>
<input name="password" id="password_l" type="password" placeholder="請輸入您的密碼" />
</div>
<div class="error btns login-form-tips" id="jsLoginTips">{% for key,error in login_form.errors.items %}{{ error }}{% endfor %}{{ msg }}</div>
<div class="auto-box marb38">
<a class="fr" href="forgetpwd.html">忘記密碼阁最?</a>
</div>
<input class="btn btn-green" id="jsLoginBtn" type="submit" value="立即登錄 > " />
<input type='hidden' name='csrfmiddlewaretoken' value='5I2SlleZJOMUX9QbwYLUIAOshdrdpRcy' />
{% csrf_token %}
</form>
兩個label上面
<div class="form-group marb8 {% if login_form.errors.password %}errorput{% endif %}">
errorput是用來顯示紅框的。
<div class="error btns login-form-tips" id="jsLoginTips">{% for key,error in login_form.errors.items %}{{ error }}{% endfor %}{{ msg }}</div>
這里的error btns login-form-tips大概是用來顯示tips的骇两。遍歷errors(這是個字典的形式速种,所以要用items),把所有的value提取并顯示出來低千,key就不顯示了配阵,外加msg。邏輯由后臺處理示血,判斷該顯示errors還是msg棋傍。