Question

在Django中，实现分页以在多个页面上显示查询项是非常简单的。使用Ajax仅更新真正已更改的页面的位数，而不是每次都加载整个页面也是非常简单的。但是，当两者合并时，我发现它有点问题。

在下面的示例中，搜索结果应显示在相应的result_list.html。

中

<form id="search-form" method="get" action=".">
        {{ form.as_p }}
        <input type="submit" value="search" />
</form>
<div id="search-results">           
       {% include "result_list.html" %}
</div>

result_list.html：

{% if sales_items %}
    {% for item in sales_items %}
            <li>
                <ul>                
                    Search Result...        
                </ul>                               
            </li>       
        {% endfor %}
        {% if show_paginator %}
                <div class="paginator">
                          ...
                  (Page {{ page }} of {{ pages }})
                </div>
        {% endif %}  
{% else %}
    {% trans 'No Items found.' %}
{% endif %}

此解决方案非常有效。因为每当我搜索（通过ajax）某些东西时，包括分页的result_list.html都会被刷新。

问题：

但是现在如果我有一张桌子，我就不能再使用这种方法了。

<table class="table">
   <thead>
        <tr>
           <th>...</th>
        </tr>
   </thead>
   <tbody id="search_result">
        {% include 'calls_list.html' %}
   </tbody>
</table>

需要刷新的页面位在<tbody>标记之间。因此，Calls_List.html仅返回<tr>所理解的<td>和<tbody>个标记。我根本无法将分页器代码粘贴在那里（与上面的例子不同）：

    {% if show_paginator %}

      <div class="paginator">
         ...
          (Page {{ page }} of {{ pages }})
      </div>
    {% endif %}

...因为表的tbody不希望在那里找到div元素。

除非我再次到服务器再次分别提取分页代码。我找不到一个干净的解决方案。

你遇到过同样的情况，你是怎么解决这个问题的？

非常感谢，

Answer 1

一种解决方案是将分页部分放在<tr>中，但可以根据需要更改可视化（例如，只需1 <td>或跨越多列等。）
另一种解决方案是，您将Calls_list.html更改为返回完整的<table>代码，并将分页部分排除在单独的<div>之外。
第三个选项可以返回行数据的JSON以及分页数据。然后只需更新现有的表行和分页html。

Django分页和Ajax查询

1 个答案: