将 AJAX 响应格式化为 HTML [关闭]

Question

我正在使用最新版本的 Wordpress。在一个私人页面上，我在下拉列表中创建了我的第一个过滤器字段。过滤器选项是从自定义表中查询的不同年份。这里没有问题。

更改过滤器字段会触发使用 jQuery 对后端的 AJAX 调用。然后 php-backend 上的回调函数在数据库上运行 2 个查询： 1. 从自定义表中获取拥有一个或多个条目的日历周 2.每周获取参赛作品

问题：第二个查询针对第一个查询的每个结果运行。因此它嵌套在一个循环中。但我也需要显示第一个值。

我尝试过的：将所有查询输出加入一个 php-string，包括每个条目的 HTML-wrapper-classes，然后使用该字符串作为 AJAX 响应。但这种尝试包括非打印文件（\n 或 \t）。我需要保持输出可读性才能对其进行编辑。它实际上并没有像 html 那样被格式化。

我的问题：

1. 是否应该在回调中将 AJAX 响应格式化为 HTML 功能？又如何在前端展示？
2. AJAX 响应是否应该只是一个 JSON 对象？第二个查询的条目如何映射到第一个查询的条目 在前端？

这是非常基本的 ajax 调用的当前代码：

            var filter = $('#filter');

            $.ajax({
                url:filter.attr('action'), // ajax
                data:filter.serialize(), // form data
                type:filter.attr('method'), // POST
                dataType:"html",
                success:function(data){

                    $('#json-response').html(data);

                    //TBD: Properly display data of response
                }
            });

预期的伪 HTML 输出如下所示：

<div class="week-container">
    <div class="week-header">
        CALENDAR WEEK 1 <-- Result from first query
    </div>
    <div class="week-entry-0">01.01.2020, ... more data</div> <-- Result from second query
    <div class="week-entry-1">03.01.2020, ... more data</div> <-- Another result from second query
</div>
<div class="week-container">
    <div class="week-header">
        CALENDAR WEEK N
    </div>
    <div class="week-entry-i">data</div>
    <div class="week-entry-i+1">data</div>
</div>
and so on...

Answer 1

Ajax 响应具有 HTML 格式是一种不好的做法。 只需将 JSON 格式的数据从服务器发送到客户端。所以这将是标准的。