Как загрузить контент по клику в yii2 framework? - PullRequest
0 голосов
/ 21 июня 2019

Я работаю над проектом yii2, и нам нужно загружать блоки с помощью ajax по клику. Я написал часть AJAX, которая работает правильно, но я застрял с Javascript. Мой наставник говорит, что я должен использовать .append, но я не могу найти способ как-то связать его с действием контроллера.

PHP:

 public function actionGetProjects() {

        $post = Yii::$app->request->post();

                $projects = Project::find()->orderBy('created_at DESC')->limit(15)->offset($post['page']*15)->all();

                if (count($projects)>0) {
                    $this->return['code'] = 200;
                    $this->return['html'] = $this->renderPartial('_projects', [
                            'projects' => $projects
                    ]);
                } else {

                    $this->return['code'] = 404;
                }
        return json_encode($this->return);
    }

UPD:

HTML

<div class="projects">
    <div class="pageHeader">My Projects</div>
    <?php foreach ($projects as $project) {?>
    <a href="project/<?=$project->id?>" class="project-block">


                <img src="<?=$project->projectImages[0] ? '/img/products/'.$project->projectImages[0]->image:''?>">

                <div class="project-title"><?=$project->name?></div>
                <div class="project-address"><?=$project->address?></div>
                <div class="project-readmore">Read more</div>


    </a>
  <?php  } ?>
    <a class="projects-load-btn" href="#">Еще</a>

</div>

Новый JS:

$(".projects-load-btn").on("click", function(e) {
    event.preventDefault();
    var id = $(this).data("id") || 0;
    $.ajax({
        type: 'POST',
        url: '/ajax/get-projects',
        data: { id: id },
        dataType: "json",
        success: function (data) {
            if(data.code == 200){
                $('.projects').addClass('test');
                $('.projects').html('');
                $('.projects').append(data);
            }
        },
        errors: function (errors) {
            console.log(errors);
        }
    });
});

Ответы [ 2 ]

1 голос
/ 25 июня 2019

У вас есть urlManager компонент, настроенный с enablePrettyUrl, установленным в значение true в вашем файле конфигурации?

Если это так, yii2 использует следующий шаблон маршрутизации по умолчанию: <controller>/<action>

В вашем случае это приведет к /ajax/get-projects url.

Полный код JavaScript будет выглядеть примерно так:

$(".projects-load-btn").on("click", function(e) {
    e.preventDefault();
    var id = $(this).data("id");
    $.ajax({
        url: "/ajax/get-projects",
        data: { id: id }
    }).done(function (data) {
        $(".projects").append(data);
    });
});
0 голосов
/ 21 июня 2019

Если я правильно помню, вы не должны отправлять действие как переменную через POST.Это зависит от того, как маршрутизация была установлена ​​в вашем приложении Yii2, поэтому я только догадываюсь:

Ajax-вызов:

$.post("Ajax/getProjects", {id:id}, function(data) { ... });

Добавление чего-либо в DOM:

$(".projects").append(jsonResponse.html);

Предположение, что это школьная работа, а значит, не дает полного решения ...

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...