Я строю иерархическое меню, которое опирается на вызовы AJAX для извлечения данных из двух отдельных файлов JSON. В настоящее время я полагаюсь на следующие 2 вызова для создания неупорядоченного списка Categories и неупорядоченного списка Sections :
//AJAX call to the the Categories JSON file
var $requestcategories = $.ajax({
url: 'https://myURL/categories.json',
dataType: 'json',
type: 'get',
cache: 'false',
success: function(data) {
let $ul = $('<ul id="categories"/>');
let html = data.categories.map(c => `<ul class='category'><li class='cat' catid=${c.id}><a>${c.name}</a></li></ul>`);
$ul.append(html).appendTo('#navbar');
}
});//This closes the Categories AJAX call
//AJAX call to the the Sections JSON file
var $requestsections = $.ajax({
url: 'https://myURL/sections.json',
dataType: 'json',
type: 'get',
cache: 'false',
success: function(data) {
let $ul = $('<ul id="sections"/>');
let html = data.sections.map(s => `<ul class='section'><li class="sec" secid=${s.id} categoryid=${s.category_id} parentsecid=${s.parent_section_id}><a href="${s.html_url}">${s.name}</a></li></ul>`);
$ul.append(html).appendTo('#navbar');
}
});//This closes the Sections AJAX call
Как только списки будут в моем HTML output, я полагаюсь на jQuery для перемещения элементов списка Разделов так, чтобы каждый из них находился под правильным элементом списка категорий.
Существует ли эффективный способ объединения моих вызовов AJAX, чтобы - вместо того, чтобы данные категорий и данные разделов первоначально помещались в два отдельных списка, я могу загрузить все данные в один неупорядоченный список (возможно, под названием «MenuItems»)? Я чувствую, что было бы проще и менее ресурсоемко работать с и переупорядочивать пункты меню, если они были первоначально выгружены в тот же родительский UL. два AJAX вызова, чтобы я мог получить все данные из обоих JSON файлов как часть ОДНОГО вызова?)
Заранее благодарим за советы и отзывы по этому вопросу.