Как я могу отобразить ошибку, представленную json через ajax?

Я пытаюсь отправить форму через AJAX на django. Соответствующий код ajax: _

<script>
$(document).ready(function(){
$('#form1').submit(function(){
    console.info('form is submitted');

    var csrftoken = $("[name=csrfmiddlewaretoken]").val();

    var formdata = {
        'username':$('input[name=user]').val(),
        'email':$('input[name=email]').val(),
        'password1':$('input[name=password]').val(),
        'password2':$('input[name=password1]').val(),
    };
    console.info("Formvalue is taken");

    $.ajax({
        type:'POST',
        url:'/Submit/signingup',
        data:formdata,
        dataType:'json',
        encode:true,
        headers:{
        "X-CSRFToken": csrftoken
        },
    })

    .done(function(data){
        console.info(data);
        if (!data.success){//we will handle error
            console.info(data.errors);
            if (data.errors.email){

                $('#user-group').append('<div class = "warning>'+data.errors.email+'</div>');
            }
            if (data.errors.username){
                $('#email-group').append('<div class = "warning>'+data.errors.username+'</div>');
            }
        }
            else{
                //all good
            }

    });


    event.preventDefault();
});
});

Сообщение об ошибке Json, возвращаемое сервером: - Как я могу отобразить ошибку, представленную json через ajax? Как я могу представить ошибки в HTML? Я хочу, чтобы каждая ошибка соответствовала соответствующим элементам div?

jquery ajax django

07.03.2019 03:29

Как конвертировать HTML в PDF с помощью jsPDF

В этой статье мы рассмотрим, как конвертировать HTML в PDF с помощью jsPDF. Здесь мы узнаем, как конвертировать HTML в PDF с помощью javascript.

Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Вы можете использовать проверку на стороне клиента, чтобы убедиться, что введены правильные данные.

07.03.2019 03:31

Ответ принят как подходящий

Вы можете сделать следующее

  if (data.errors){
        for (let key in data.errors) {
                        $('#' + data.errors[key][0] + '-error').text(data.errors[key][1]);  // key in your case is email,password2
                    }
                return false;
}

В html

<div class = "form-group">
                <label for = "name">Name*</label>
                <input class = "form-control" id = "name" required = "required" name = "name" type = "text" value = "">
                <span class = "error" id = "name-error"></span>
            </div>
            <div class = "form-group">
                <label for = "contact-email">Email*</label>
                <input class = "form-control" id = "email" required = "required" name = "email" type = "text" value = "">
                <span class = "error" id = "email-error"></span>  // here id is email-error so you must must email key in error return by server.
            </div>

В этом случае помните, что идентификатор в диапазоне и ключ в ошибке на стороне сервера должны совпадать. Надеюсь, это поможет.

Нет, потому что в этом случае ключ, который принимает консоль, - это числа, такие как 0,1, а не электронная почта, пароль1.

— 08.03.2019 01:40

Привет @Гаган. Мне пришлось изменить код. Пожалуйста, посмотрите.

— 08.03.2019 02:04

07.03.2019 04:04