时间戳

首页 > 解决方案 > 是否可以分页下一个和上一个链接以在特定 div 加载页面

php - 是否可以分页下一个和上一个链接以在特定 div 加载页面

问题描述

一定要把问题弄清楚，说清楚让我详细说明；我需要实现的是我有一个分页正在向前工作的页面，当我对页面进行分页时，页面会转到页面顶部，因为它确实刷新了，但我需要它留在分页链接的 div处于。分页内容所在的内容区域，可能看起来页面没有加载，只有内容被更新。一定要明白这一点。

代码如下：

<div class="large-12 columns" id="paginate" style="border-right: 1px solid #E3E5E8; height: 572px;">
    <article>
        <hr><div class="row">
            <div class="large-6 columns">
        <?php
        //stories complete do not edit. 
            foreach($stories as $story){

                echo '
                <p>'.$this->Html->image($story['image'].'.jpg', ['alt'=>'image for article']).'</p>
                </div>
                <div class="large-6 columns">
                <h5><a href="#">'.$story['title'].'</a></h5>
                <p>
                <span><i class="fi-torso"> Creator: '.$story['creator'].' &nbsp;&nbsp;</i></span>
                <span><i class="fi-calendar"> '.$story['created'].' &nbsp;&nbsp;</i></span>

                </p>
                <p>'.$story['story'].'</p>';

                //same place after pagination
                //
            }

        ?>

            </div>

                <div style="padding: 2px;float: left;margin-top: 31%;margin-left: -1206px;">
                    <ul class="pagination" role="navigation" aria-label="Pagination">
                        <li><?php echo $this->Paginator->prev(' < ' . __(''));?></li>
                        <li><?php echo $this->Paginator->numbers();?></li>
                        <li><?php echo $this->Paginator->next(' > ' . __(''));?></li>
                    </ul>
                </div>
            </div><hr>

        </article>
    </div>

根据代码和早期的 Cakephp 代码，我们能够使用分页器添加到 div 的链接，它会将我们直接带到特定的 div，我无法弄清楚使用 cakephp-4.x 执行此操作的语法，所以请善待和用最少的代码给你最好的解决方案。

标签： phphtmlcsszurb-foundationcakephp-4.x

解决方案

我找到了解决问题的方法。这比任何其他从互联网上可以找到的解决方案都具有建设性。我将描述代码并放置代码片段，以便每个人和任何人都可以通过阅读我的代码片段来做到这一点。

首先声明特定模型的分页。在初始化分页器代码片段之后。完成上述操作后，将分页器加载并查询到给定模型。之后设置变量以及紧凑。

在模板端，确保您已遵循上述过程，所有给定的代码将在控制器端分配并自动在模板端工作。我将模板的代码放在代码片段的底部，好好阅读并在控制器和模板之间有请求和响应的任何时候实现你的代码。

将以下代码放入控制器：

    public $paginate = [

        'Stories' => ['scope' => 'story',
                      'limit' => 1,
                      ]
    ];


    public function initialize(): void
    {
        parent::initialize();
        $this->loadComponent('Paginator');
    }

    public function index()
    {

        // Paginate property
        $this->loadComponent('Paginator');

        $stories = $this->paginate($this->Stories->find('all', ['scope' => 'story']));
        $this->set(compact('employers'));
    }

下面的代码模板：

<div class="column" id="success_story">
    <hr>
    <h4 style="margin: 0;" class="text-center">SUCCESS STORIES</h4>
    <hr>
</div>

<?php
  //stories complete do not edit. 
  foreach($stories as $story){

    echo '
    <p>'.$this->Html->image($story['image'].'.jpg', ['alt'=>'image for article']).'</p>
    </div>
    <div class="large-6 columns">
    <h5><a href="#">'.$story['title'].'</a></h5>
    <p>
    <span><i class="fi-torso"> Creator: '.$story['creator'].' &nbsp;&nbsp;</i></span>
    <span><i class="fi-calendar"> '.$story['created'].' &nbsp;&nbsp;</i></span>

    </p>
    <p>'.$story['story'].'</p>
    ';
  }
?>

<div style="padding:0px;margin:0px;margin-bottom: -35px;">
  <ul class="pagination" role="navigation" aria-label="Pagination">
    <li><?php echo $this->Paginator->prev(' < ' . __(''));?></li>
    <li><?php echo $this->Paginator->next(' > ' . __(''));?></li>
  </ul>
</div>

将success_story(div) 的链接作为#(indicator)

推荐阅读