ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

php – Symfony2 Ajax Infinite Scroll

2019-08-24 12:30:10  阅读:189  来源: 互联网

标签:php jquery ajax symfony infinite-scroll


我是Symfony2的新手,并不完全理解路由和模板.请帮助解决以下问题:
我需要使用Symfony 2和Ajax实现无限滚动.我有indexController从db获取10个库项目.我希望每次向下滚动时再获得10个项目.
这是控制器:

 /**
 * @Route("/", name="gallery_homepage")
 */
public function indexAction(Request $request)
{
    $em = $this->getDoctrine()
        ->getEntityManager();

    if($request->isXmlHttpRequest())
    {
        $page = $request->get('page', 1);
        $limit = 10;
        $start = $page * $limit - $limit;

        $objects = $em->createQueryBuilder()
            ->select('o')
            ->from('ObjectBundle:Object',  'o')
            ->getQuery()
            ->setFirstResult($start)
            ->setMaxResults($limit)
            ->getResult();

        $response = json_decode($objects);

        return new Response(???));
    }
    else
    {

    }
}

这是树枝模板

{% block body %}
<section class="container">
<ul class="printedall">
    {% for object in objects %}
        <li class="printedimgs">
            <a class="object_prints" href="object.url">
                <img src="object.imageURL"/>
            </a>
        </li>
    {% endfor %}
</ul>
</section>
{% endblock %}

控制器必须返回什么响应才能从db中获取10个项目并将它们附加到显示的项目中?

这是javascript

 is_processing = false;
 last_page = false;
 function addMoreElements() {
     is_processing = true;
     $.ajax({
         type: "GET",
         //FOS Routing
         url: Routing.generate('gallery_homepage', {page: page}),
         success: function(data) {
             if (data.html.length > 0) {
                 $('.printedall').append(data.html);
                 page = page + 1;

            last_page = data.last_page;
        } else {
            last_page = true;
        }
        is_processing = false;
    },
    error: function(data) {
        is_processing = false;
    }
});
 }

 $(window).scroll(function() {
     var wintop = $(window).scrollTop(), docheight = $(document).height(),      winheight = $(window).height();

     var scrolltrigger = 0.80;
     if ((wintop / (docheight - winheight)) > scrolltrigger) {

    if (last_page === false && is_processing === false) {
        addMoreElements();
         }
     }
 });

解决方法:

您可以使用控制器中的Request类,您可以从中获知该请求是否为AJAX.您还必须在查询对象上调用setFirstResult和setMaxResults方法:

use Symfony\Component\HttpFoundation\Response;

// ...

public function indexAction(Request $request) {
    if ($request->isXmlHttpRequest()) {
        //~ Is AJAX Request

        $offset = $request->get('offset');
        $limit = $request->get('limit');

        $em = $this->getDoctrine()
            ->getEntityManager();

        $objects = $em->createQueryBuilder()
            ->select('o')
            ->from('ThreedBundle:Threedobject',  'o')
            ->where('o.status = 2 AND o.showGallery = 1')
            ->getQuery()
            ->setFirstResult($offset)
            ->setMaxResults($limit)
            ->getResult();
    } else {
        //~ Request is not AJAX
    }
}

对于无限滚动,您可以使用任何jquery无限滚动插件:

例如http://infiniteajaxscroll.com/examples/basic/page1.html

标签:php,jquery,ajax,symfony,infinite-scroll
来源: https://codeday.me/bug/20190824/1707984.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有