我已经缩小到以下内容，如果有人可以帮助我指出如何将以下内容转换为很棒的表格视图，请参阅。以下html是从base.html扩展而成的
{% block page_content %}
<h1>Projects</h1>
<div class="row">
{% for project in projects %}
<div class="col-md-4">
<div class="card mb-2">
<img class="card-img-top" src="{% static project.image %}">
<div class="card-body">
<h5 class="card-title">{{ project.title }}</h5>
<p class="card-text">{{ project.description }}</p>
<a href="{% url 'project_detail' project.pk %}"
class="btn btn-primary">
Read More
</a>
</div>
</div>
</div>
{% endfor %}
</div>
{% endblock %}
需要在gridview中显示数据的帮助。我是这一切的新手。我能够从mongodb读取并显示页面上的数据，但需要显示在表格中。
现在对我来说，百万美元的问题是我应该在我的代码中调整以下代码片段的位置，以便为我提供gridview
<table>
<tr>
<th>Field 1</th>
<th>Field N</th>
</tr>
{% for item in query_results %}
<tr>
<td>{{ item.field1 }}</td>
...
<td>{{ item.fieldN }}</td>
</tr>
{% endfor %}
</table>
我的urls.py
from django.urls import path
from .import views
urlpatterns = [
path("",views.project_index, name = "project_index"),
path ("<project_detail>/",views.project_detail, name = "project_detail"),
#path("<int:pk>/", views.project_detail, name = "project_detail"),
]
我的模型。py
from django.db import models
# Create your models here.
class Project(models.Model):
title = models.CharField(max_length=100,primary_key=True)
desc = models.CharField(max_length=100)
urls = models.CharField(max_length=100)
#image = models.FilePathField(path="/img")
class Meta:
db_table = "spiderCollection1"
additional table.py
import django_tables2 as tables
from .models import Project
import itertools
class ProjectTable(tables.Table):
class Meta:
model = Project
template_name = "django_tables2/bootstrap.html"
title = tables.Column("title")
desc = tables.Column("desc")
urls = tables.Column("urls")
以下为views.py
from django_tables2 import SingleTableView
from django.shortcuts import render
from projects.models import Project
from projects.tables import ProjectTable
# Create your views here.
class ProjectListView(SingleTableView):
model = Project
table_class = ProjectTable
template_name = '/projects.html'
def project_index(request):
projects = Project.objects.all()
context = {
"projects":projects
}
return render (request, 'project_index.html',context)
#return render (request, 'project_index.html',locals())
def project_detail(request, pk):
#project = Project.objects.get(pk=pk)
project = Project.objects.all()
context = {
"project": project
#'personal_portfolio':project
}
return render(request, 'project_detail.html',context)
我的主要base.html
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container">
<a class="navbar-brand" href="{% url 'project_index' %}">Portfolio</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="{% url 'project_index' %}">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Blog</a>
</li>
</ul>
</div>
</div>
<!--<style>
h1 {
border: 5px solid red;
}
h2 {
border: 4px dotted blue;
}
div {
border: double;
}
</style>
-->
</nav>
<div class="container">
{% block page_content %}
{% endblock %}
</div>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
现在是project_index.html
{% extends "base.html" %}
{%load render_table from django_tables %}
{% load static %}
{% block page_content %}
<h1>Projects</h1>
<div class="row">
{% for project in projects %}
<div class="col-md-4">
<div class="card mb-2">
<img class="card-img-top" src="{% static project.image %}">
<div class="card-body">
<h5 class="card-title">{{ project.title }}</h5>
<p class="card-text">{{ project.description }}</p>
<a href="{% url 'project_detail' project.pk %}"
class="btn btn-primary">
Read More
</a>
</div>
</div>
</div>
{% endfor %}
</div>
{% endblock %}
如果目标是不使用django-table2包而显示表，请遵循答案的第一部分。如果目标是使用django-table2，则跳至第二部分：
第一部分
根据您的想法，让我们使用示例代码段，然后对其进行编辑，以便在HTML表格中显示project数据...
[从project_index.html开始，我们需要使用<table>，<thead>，<tbody>和<th>标签创建html表的框架，然后遍历传递的projects上下文变量并添加使用<td>标签在表格中输入数据。并且因为您正在使用引导框架，所以我们将需要行和列divss才能正确显示表。
{% extends "base.html" %}
{% load static %}
{% block page_content %}
<h1>Projects</h1>
<div class="row">
<div class="col-md-4">
<table class="table table-striped table-hover">
<thead>
<th>#</th>
<th>title</th>
<th>description</th>
</thead>
<tbody>
{% for project in projects %}
<td><strong>{{ forloop.counter }} </strong></td>
<td><strong>{{ project.title}</strong></td>
<td>{{ project.description} <a href="{% url 'project_detail' project.pk %}" class="btn btn-primary">Read More</a> </td>
{% endfor %}
</tbody>
</table>
<div>
</div>
{% endblock %}
请确保您的url.py指向功能project_index
要了解更多信息，请检查：
第二部分
Django-table2是一个软件包，提供用于生成html表的应用和中间件。为了在您的应用中使用它，请对project_index.html进行以下更改：
{% extends "base.html" %}
{% load render_table from django_tables %}
{% load static %}
{% block page_content %}
<h1>Projects</h1>
<div class="row">
<div class="col-md-4">
{% render_table projects %}
</div>
</div>
{% endblock %}
上面的代码将使用django-table2提供的html模板来呈现表，该表在类ProjectTable中定义
class ProjectTable(tables.Table):
class Meta:
model = Project
template_name = "django_tables2/bootstrap.html"
...
如果要使用自定义呈现，则需要将ProjectTable的template_name设置为您的custom.html：
class ProjectTable(tables.Table):
class Meta:
model = Project
template_name = "custom.html"
...
现在创建custom.html并添加实际上将迭代项目上下文变量各项的代码。也许像这样（从django_tables2 / semantic.html复制）...对此模板进行更改。
{% load django_tables2 %}
{% load i18n %}
{% block table-wrapper %}
<div class="ui container table-container">
{% block table %}
<table {% render_attrs table.attrs class="ui celled table" %}>
{% block table.thead %}
{% if table.show_header %}
<thead {{ table.attrs.thead.as_html }}>
<tr>
{% for column in table.columns %}
<th {{ column.attrs.th.as_html }}>
{% if column.orderable %}
<a href="{% querystring table.prefixed_order_by_field=column.order_by_alias.next %}">{{ column.header }}</a>
{% else %}
{{ column.header }}
{% endif %}
</th>
{% endfor %}
</tr>
</thead>
{% endif %}
{% endblock table.thead %}
{% block table.tbody %}
<tbody {{ table.attrs.tbody.as_html }}>
{% for row in table.paginated_rows %}
{% block table.tbody.row %}
<tr {{ row.attrs.as_html }}>
{% for column, cell in row.items %}
<td {{ column.attrs.td.as_html }}>{% if column.localize == None %}{{ cell }}{% else %}{% if column.localize %}{{ cell|localize }}{% else %}{{ cell|unlocalize }}{% endif %}{% endif %}</td>
{% endfor %}
</tr>
{% endblock table.tbody.row %}
{% empty %}
{% if table.empty_text %}
{% block table.tbody.empty_text %}
<tr><td colspan="{{ table.columns|length }}">{{ table.empty_text }}</td></tr>
{% endblock table.tbody.empty_text %}
{% endif %}
{% endfor %}
</tbody>
{% endblock table.tbody %}
{% block table.tfoot %}
<tfoot {{ table.attrs.tfoot.as_html }}>
{% if table.has_footer %}
<tr>
{% for column in table.columns %}
<td {{ column.attrs.tf.as_html }}>{{ column.footer }}</td>
{% endfor %}
</tr>
{% endif %}
{% block pagination %}
{% if table.page and table.paginator.num_pages > 1 %}
<tr>
<th colspan="{{ table.columns|length }}">
<div class="ui right floated pagination menu">
{% if table.page.has_previous %}
{% block pagination.previous %}
<a href="{% querystring table.prefixed_page_field=table.page.previous_page_number %}" class="icon item">
<i class="left chevron icon"></i>
</a>
{% endblock pagination.previous %}
{% endif %}
{% if table.page.has_previous or table.page.has_next %}
{% block pagination.range %}
{% for p in table.page|table_page_range:table.paginator %}
{% if p == '...' %}
<a href="#" class="item">{{ p }}</a>
{% else %}
<a href="{% querystring table.prefixed_page_field=p %}" class="item {% if p == table.page.number %}active{% endif %}">
{{ p }}
</a>
{% endif %}
{% endfor %}
{% endblock pagination.range %}
{% endif %}
{% if table.page.has_next %}
{% block pagination.next %}
<a href="{% querystring table.prefixed_page_field=table.page.next_page_number %}" class="icon item">
<i class="right chevron icon"></i>
</a>
{% endblock pagination.next %}
{% endif %}
</div>
</th>
</tr>
{% endif %}
{% endblock pagination %}
</tfoot>
{% endblock table.tfoot %}
</table>
{% endblock table %}
</div>
{% endblock table-wrapper %}
请确保您的urls.py包括：
...
path("projects/", ProjectListView.as_view())
...
有关更多信息，请参阅：