Как вывести все элементы массива JS

Question

Как вывести все элементы массива JS

Рейтинг: 0Ответов: 2Опубликовано: 23.06.2023

У меня с бека приходят ошибки валидации и мне нужно показать их пользователю. Сейчас отображается только последняя ошибка. Как я понял они перезаписывают друг друга. Как можно исправить что бы все ошибки показались?

$.each(data.errors, function(key, value){
    $('.alert-danger').html(
        '<p>'+value+'</p>'
    );
});

javascript

Источник: Stack Overflow на русском

Answer 1

▲ 1Принят

Помещаете все ошибки в переменную
Передаете переменную в html()

Пример:

let data = {
  errors: ['123', '456']
}

function onClickBtn() {

  let newHTML = '';

  $.each(data.errors, function(key, value) {
    newHTML += `<p>${value}</p>`
  });

  $('.alert-danger').html(newHTML);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class='alert-danger'></div>

<button>Вывести ошибку</button>

Answer 2

▲ 0

Как можно исправить что бы все ошибки показались?

Например можно вот так показывать ошибки...

const data = {
  errors: ['Ошибка 1', 'Ошибка 2', 'Ошибка 3', 'Ошибка 4']
}
$('.alert-danger').empty()
$.each(data.errors, function(key, value) {
  $('.alert-danger').append('<p>' + value + '</p>');
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='alert-danger'></div>

Или вот так

const data = {
  errors: ['Ошибка 1', 'Ошибка 2', 'Ошибка 3', 'Ошибка 4']
}
const val = data.errors.join('</p><p>')
$('.alert-danger').html(`<p>${val}</p>`)

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class='alert-danger'></div>

Как вывести все элементы массива JS

Ответы