Разделить вывод API на два столбца

Question

Я хочу создать меню нижнего колонтитула из двух столбцов из запроса на получение API. Этот код выводит элементы категории в один столбец. Я хочу сделать это двумя столбцами, , если элементов категории больше четырех, эти элементы категории должны перейти во второй столбец .

ajax -скрипт. php

    jQuery(document).ready(function ($) {
            jQuery.when( jQuery.ajax({
                url: config_lymited_home + 'api/category-pages/filter/included-in-buy-menu',
                crossDomain: true,
                async: true,
                cache:false,
                type: 'GET',
            })).then(function (footerlink) {

              if (footerlink[0].data.length > 0) {
                  if((footerlink[0].data > 0) && (footerlink[0].data < 4)) {
                    $.each(footerlink[0].data, function (k, row) {
                        $('#footerlink').append('<li><a class="footer-links" href=' + config_lymited_home + 'type/' + row.slug + '/buy' + '>' + row.name + '</a></li>');
                    });
                }
             else {
                $.each(footersecondrow[0].data, function (k, row) {
                    $('#footersecondrow').append('<li><a class="footer-links" href=' + config_lymited_home + 'type/' + row.slug + '/buy' + '>' + row.name + '</a></li>');
                });
            }
        }
      });
  });

нижний колонтитул. php

<div class="row">
    <div class="col-md-12 col-lg-12 footer-links">
 <ul id="footerlink"></ul>
 <ul id="footersecondrow"></ul>
    </div>
</div>

Спасибо за любую помощь.

Answer 1

Я считаю, что вы хотите поместить свой оператор else в свое первое предложение if, а затем вызвать footerlink[0].data вместо footerescondrow[0].data, потому что footersecondrow никогда не определяется.

if (footerlink[0].data.length > 0) {
  if ((footerlink[0].data > 0) && (footerlink[0].data < 4)) {
    $.each(footerlink[0].data, function(k, row) {
      $('#footerlink').append('<li><a class="footer-links" href=' + config_lymited_home + 'type/' + row.slug + '/buy' + '>' + row.name + '</a></li>');
    });
  } 
  else {
    $.each(footerlink[0].data, function(k, row) {
      $('#footersecondrow').append('<li><a class="footer-links" href=' + config_lymited_home + 'type/' + row.slug + '/buy' + '>' + row.name + '</a></li>');
    });
  }
}

Вы можете добавить отдельные столбцы в свой PHP файл, чтобы получить разделенные столбцы.

<div class="row">
    <div class="col-md-6 col-lg-6 footer-links">
       <ul id="footerlink"></ul>
    </div>
    <div class="col-md-6 col-lg-6 footer-links">
       <ul id="footersecondrow"></ul>
    </div>
</div>