Question

我正在尝试通过使用Django在datatables提供的默认搜索栏中进行搜索来获取数据。将显示默认视图，但是当我在搜索框中搜索时，它什么也不显示。它显示的视图如下：

我的看法是这样

def searchProductTable(request):
    xh = ProductLaptop.objects.all()
    context = {
        "xh": xh
    }
    return render(request, "searchTableView.html", context)

对于以下模型：

class ProductLaptop(models.Model):
    laptops_name = models.CharField(max_length=500, null=True, blank=True)
    laptops_url = models.CharField(max_length=500, null=True, blank=True)
    laptops_price = models.IntegerField(null=True, blank=True)
    laptops_image = models.CharField(max_length=400, null=True, blank=True)
    brand_name = models.CharField(max_length=20, null=True, blank=True)

    def __str__(self):
        return self.laptops_name

我知道该模型不正确，同时我也不知道该如何实现该模型，因为我对Django的使用经验不足。

.html文件的代码为：

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Search Table</title>
    <link href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css" rel="stylesheet">
    <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>


</head>
<body>
  <table id="example" class="display" style="width:100%">
        <thead>
            <tr>
                <th>Name</th>
                <th>Seller</th>
                <th>Price</th>

            </tr>
        </thead>
        <tbody>
        {% for foo in xh %}
            <tr>


                <td>{{ foo.laptops_name}}</td>
                <td>{{ foo.brand_name}}</td>
                <td>{{ foo.laptops_price}}</td>
                {% endfor %}


            </tr>
        </tbody>
  </table>

<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script>
    $('#example').dataTable({
    ajax: {
        url: 'http://127.0.0.1:800/searchtable/',
        dataSrc: ''
    },
    columns: [
        { "data": "laptops_name"},
        { "data": "brand_name"},
        { "data": "laptops_price"},
    ]
});
</script>

</body>
</html>

任何人都可以帮助我解决此问题。最近两天，我一直在尝试使用DataTable进行排序，搜索和分页。

Answer 1

首先，您不需要在HTML中明确指定列定义。您只需要<table id="example"></table>。

此外，您还必须注意，由于将'dataSrc'设置为空字符串，因此客户端需要来自服务器的条目数组。

因此，您可能希望使用浏览器的开发人员工具控制台检查从服务器收到的可能的错误和数据格式，以解决问题。

Answer 2

for 循环应该高于 tbody

将您的代码更改为如下所示：

{% for foo in xh %}
<tbody>
    <tr>
        <td>{{ foo.laptops_name}}</td>
        <td>{{ foo.brand_name}}</td>
        <td>{{ foo.laptops_price}}</td>
    </tr>
</tbody>
{% endfor %}

使用Django的数据表无法从MySQL数据库获取数据

2 个答案: