我正在验证用户在onblur事件中将其电子邮件地址放入字段时是否已经存在。我还使用了一个外部JS文件,它将ajax请求发送到指定的url。然而,它不起作用。当我开始在字段中输入时,它告诉我电子邮件地址已经存在。我这样做对吗
代码如下:
views.py
def validate_stud_username(request):
if request.is_ajax():
username = request.GET.get('stud_email', None)
response = {
'is_taken':
User.objects.filter(username__iexact=username).exists()
}
return JsonResponse(response)
url.py
urlpatterns = [
path('', views.home, name="home"),
path('login/', views.login, name="login"),
path('signup/', views.signup, name="signup"),
path('validate_stud_username', views.validate_stud_username,
name='validate_stud_username'),
]
signup.html
<form action="{% url 'signup' %}" id="stud_registration_form"
method="POST" data-url="{% url 'validate_stud_username' %}">
{% csrf_token %}
<input type="email" id="stud_email" style="color: black;"
name="stud_email" value="" placeholder=" Email"
autocapitalize="none" required>
<span style="color: red;" class="error_form" id="stud_email_err">
</span>
<button class="btn btn-primary btn-block login_btn" type="submit"
style="padding: 2% 0;"> Sign Up </button>
</form>
form_validations.js
$("#stud_email").blur(function () {
$.ajax({
data: $(this).serialize(),
url: $("form#stud_registration_form").data("url"),
success: function (response) {
$("#stud_email").removeClass("valid taken");
if (response.is_taken == true) {
$("#stud_email").addClass("taken");
} else {
$("#stud_email").addClass("valid");
}
check_stud_email();
},
error: function (response) {
console.log(response.responseJSON.errors);
},
});
});
function check_stud_email() {
var pattern = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
var email = $("#stud_email").val();
if (pattern.test(email)) {
$("#stud_email_err").hide();
$("#stud_email").css("border-bottom", "2px solid #34F458");
return false;
} else {
if (!$("#stud_email").val()) {
$("#stud_email_err").html("Email cannot be blank");
}
if ($("#stud_email").hasClass("taken")) {
$("#stud_email_err").html(
"Email address already exists! Use another one or log in"
);
} else {
$("#stud_email_err").html("Invalid email address");
}
$("#stud_email_err").show();
$("#stud_email").css("border-bottom", "2px solid #F90A0A");
return true;
}
}
目前没有回答
相关问题 更多 >
编程相关推荐