在cakephp中使用ajax加载画廊

Gallery load with ajax in cakephp

本文关键字:加载 ajax cakephp      更新时间:2024-06-11

我使用Cakephp 2.8.0。我的问题是ajax。我不知道如何在我的应用程序中实现ajax。我有与类别的li链接,点击后我需要删除一些html代码,并在我的控制器中找到必要的类别,并在响应html中获得这个数组并打印它。

我的PhotosController操作:

public function getPhotoByCategory($category = null)
{
    $category=$_GET['category'];
    debug($category);
    $this->render('getPhotoByCategory', 'ajax');
}

我的html代码:

 <div class="lol">
            <ul>
                <?php foreach($categories as $category):?>
                <li>
                    <a href="<?php echo $category['Category']['cat_name'];?>" class="lol"><?php echo $category['Category']['cat_name'];?></a>
                </li>
                <?php endforeach;?>
            </ul>
        </div>

我的JS代码:

$(".lol").click(function (e) {
    e.preventDefault();
    var category = $(this).attr("href");
    $.ajax({
        type: 'get',category,
        data: {catyegory:
        url: '<?php echo $this->Html->url(array('controller' => 'Photos', 'action' => 'getPhotoByCategory')); ?>',
        success: function(response) {
            if (response.error) {
                alert(response.error);
                console.log(response.error);
            }
            if (response.content) {
                $('#target').html(response.content);
            }
        },
        error: function(e) {
            alert("An error occurred: " + e.responseText.message);
            console.log(e);
        }
    });
});

在这种情况下,请帮助我在cakepp中使用右ajax。

我发现处理AJAX获取项目的最佳方法是创建要插入的项目的元素(在您的情况下是来自类别的照片)。

PhotosController.php

public function getPhotoByCategory($category = null)
{
    $this->set('photos', $this->Photo->find('all', ['conditions' => ['category_id' => $category]]);
    $this->render('Elements/getPhotoByCategory'); 
}

上例中的元素包含一个for循环,该循环遍历$photos并输出它们。然后使用下面的JS代码将其加载到div"lol"中:

视图/照片/get_photo_by_category.ctp

<button class="loadphoto">Load Photos</button>
<div class="lol">
</div>

JS代码(视图顶部?)

$('.loadphotos').click(function(e) {
    $('.lol').load('/Photos/getPhotoByCategory/1')
    .fail(alert("error"));
});

Dereuromark在AJAX和CakePHP 上做了一些不错的文档