在Django-temp中分页和行格式设置困难

2024-09-30 00:26:28 发布

您现在位置:Python中文网/ 问答频道 /正文

我正在尝试实现分页。我主要遵循django文档进行分页,https://docs.djangoproject.com/en/1.8/topics/pagination/...I不确定我做错了什么,但是分页效果没有被激活:当我将page设置为只有3个post时,它仍然显示9个post。我没有做什么特别的事,我只是按照文件做的。在

def category_detail(request, slug):

    obj = NewsCategory.objects.get(slug=slug)
    newsInCat = obj.news_set.all() #for the list of news
    paginator = Paginator(newsInCat, 3) # Show 25 contacts per page
    page = request.GET.get('page')
    try:
        news_set = paginator.page(page)
    except PageNotAnInteger:
        # If page is not an integer, deliver first page.
        news_set = paginator.page(1)
    except EmptyPage:
        # If page is out of range (e.g. 9999), deliver last page of results.
        news_set = paginator.page(paginator.num_pages)


bestInCat = obj.news_set.get_bestInCat()
specialInCat = obj.news_set.get_special()
mustSeeInCat = obj.news_set.get_mustSeeInCat()
recommend = obj.news_set.get_recommend()
ad2 = Sponsored.objects.get_ad2()

context = {
    "obj":obj, 
    "news_set":news_set,
    "newsInCat":newsInCat,
    "bestInCat":bestInCat,
    "specialInCat":specialInCat,
    "mustSeeInCat":mustSeeInCat,
    "recommend":recommend,
    "ad2":ad2
}

下面是我的html…除了分页,我还有一个问题。当文章的标题变得太长,以至于它打断了另一行,我的页面的格式就会混乱。看起来像这样

enter image description here

enter image description here

^{pr2}$

Tags: ofobjgetpagepostnewspaginatorslug
3条回答

我可以谈谈你的HTML/CSS格式问题。col-sm-4告诉我您使用的是Bootstrap,它按照12列宽度定义布局。引导将始终尝试使所有行的with等于12。在

现在,您在所有对象上循环并添加n列,每个列的宽度为col-sm-4。boosttrap试图确保每一个都占到行的三分之一,但是添加的div超过了3个div,这超过了12个列宽。一旦专栏文章满了(从第4条新闻开始),Bootstrap会尽可能地将div移到{}的顶部,同时仍然遵循宽度只能是12的规则。在

在图中的例子中,引导程序偏移了div的第4个和第5个,因为偏移允许它们更接近row的顶部。在

要解决这个问题,您需要将每组三个新闻条目放在自己的行中,这样您的3col-sm-4div的总宽度为12。在

根据模板判断,您必须仍然包括完整列表以及分页集

在模板中,您正在迭代newsInCat,而不是news_set

{% for news in newsInCat %}

应该是

^{pr2}$

在这里,有两个独立的问题在上面的答案中已经指出:

  1. 您没有正确使用引导程序:尽管您可以将多个<div class="col-sm-4">附加在一起,但是如果它们的高度不同,您将在屏幕截图中看到不规则的折叠行为。<div class="row">的目的是确保列出现在单独的行中。有关详细信息,请参见Must Bootstrap container elements include row elements?。在

    您可以在for循环中使用如下代码来解决此问题,以便每隔三个项目添加一个新行:

    {% if forloop.counter|divisibleby:3 %}
    </div>
    <div class="row">
    {% endif %}
    
  2. 您没有在模板中使用正确的上下文对象:paginator对象在上下文对象中作为news_set传递,但是模板使用了另一个上下文对象:newsInCat,它没有分页。如果您按照@Sayse的建议使用news_set对象,那么您应该状态良好:

    ^{2美元

作为一个最后的建议<article>标记除了给出语义值之外似乎没有做任何事情。为什么不直接使用它而不是div,这样就有了<article class="col-sm-4">?在

最后一点,在Python中camelCase通常是不受欢迎的。试着用小写字母加下划线,就像你已经用了news_set。在

添加所有这些建议后,您只需将模板修改为以下内容:

<div class="row">
  {% for news in news_set %}
  <article class="col-sm-4">
    <!  add your article content here...and clean it up! You have unnecessary spaces, inconsistent use of single and double quotes, and inline styles that (probably) should be defined in an external stylesheet.  >
  </article>
{% if forloop.counter|divisibleby:3 %}
</div>
<div class="row">
{% endif %}
  {% endfor %}
</div>

相关问题 更多 >

    热门问题