Ajax Pagination в Load More (из видеоурока)

Пытаюсь переделать Ajax Pagination в Load More из данного видеоурока Making Websites With October CMS - Part 43 - Ajax Pagination

Page movie-filter-ajax.htm

title = "Filter movies"
url = "/ajax-filter"
layout = "default"
is_hidden = 0

==
<?
    use Watchlearn\Movies\Models\Movie;
    use Watchlearn\Movies\Models\Genre;

    function onStart() { 
        $this->prepareVars(); 
        $this->prepareYears();
    }
    function onFilterMovies() { $this->prepareVars(); }


    function prepareVars() {
        $options = post('Filter', []);

        $this['movies'] = Movie::listFrontEnd($options);
        $this['genres'] = Genre::all();
        $this['sortOptions'] = Movie::$allowedSortingOptions;
        $this['pages'] = $this['movies']->lastPage();
        $this['page'] = $this['movies']->currentPage();
    }

    function prepareYears() {
        $movies = Movie::all();
        $years = [];

        foreach($movies as $movie){
            $years[] = $movie->year;
        }

        $years = array_unique($years);

        $this['years'] = $years;
    }

?>
==
<h2 class="ui header" style="margin-top:40px;">Filter Movies</h2>

<div class="ui grid">
    
    <div class="five wide column">
        {{ form_ajax('onFilterMovies', { update: { 'movies/movies': '#partialMovies', 'movies/paginate': '#partialPaginate' } }) }}
            <div id="MoviesFilter" class="movies-filter ui form">
                <div class="ui segment vertical">
                    <label>Genres</label>
                    {% for genre in genres %}
                        <div class="field">
                            <div class="ui checkbox">
                                <input type="checkbox" name="Filter[genres][]" value="{{ genre.id }}" />    
                                <label>{{genre.genre_title}}</label>
                            </div>
                        </div>
                    {% endfor %}

                    <div class="field">
                        <label>Year</label>
                        <select class="ui fluid dropdown" name="Filter[year]">
                            <option value="">Select Year</option>
                            {% for year in years|sort %}
                                <option value="{{year}}">{{ year }}</option>
                            {% endfor %}
                        </select>
                    </div>

                    <div class="field">
                        <label>Sorting</label>
                        <select class="ui fluid dropdown" name="Filter[sort]">
                            {% for code, option in sortOptions %}
                                <option value="{{code}}">{{ option }}</option>
                            {% endfor %}
                        </select>
                    </div>

                    <div class="field" id="partialPaginate">
                        {% partial 'movies/paginate' %}
                    </div>
                </div>
            </div>
        {{ form_close() }}
    </div>

    <div class="eleven wide column">
        <div id="partialMovies">
            {% partial 'movies/movies' %}
        </div>
    </div>

</div>

{% partial 'movies/paginate' %}

<label>Page</label>
<select class="ui fluid dropdown" name="Filter[page]">
    {% for i in 1..pages %}
        {%  if i == page %}
            <option value="{{page}}" selected>{{ page }}</option>
        {% else %}
            <option value="{{i}}">{{ i }}</option>
        {% endif %}
    {% endfor %}
</select>

Models Movie.php

<?php namespace Watchlearn\Movies\Models;
use Model;
/**
 * Model
 */
class Movie extends Model
{
    use \October\Rain\Database\Traits\Validation;
    /*
     * Validation
     */
    public $rules = [
    ];
    /*
     * Disable timestamps by default.
     * Remove this line if timestamps are defined in the database table.
     */
    public $timestamps = false;

    /**
     * @var string The database table used by the model.
     */
    public $table = 'watchlearn_movies_';

    //protected $jsonable = ['actors'];

    /* Relations */

    public $belongsToMany =[
        'genres' =>[
            'Watchlearn\Movies\Models\Genre',
            'table' => 'watchlearn_movies_movies_genres',
            'order' => 'genre_title'
        ],
        'actors' =>[
            'Watchlearn\Movies\Models\Actor',
            'table' => 'watchlearn_movies_actors_movies',
            'order' => 'name'
        ]
    ];

    public $attachOne = [
        'poster' => 'System\Models\File'
    ];

    public $attachMany = [
        'movie_gallery' => 'System\Models\File'
    ];

    public static $allowedSortingOptions = array (
        'name desc' => 'Name - desc',
        'name asc' => 'Name - asc',
        'year desc' => 'Year - desc',
        'year asc' => 'Year - asc'
    );

    public function scopeListFrontEnd($query, $options = []){

        extract(array_merge([
            'page' => 1,
            'perPage' => 10,
            'sort' => 'created_at desc',
            'genres' => null,
            'year' => ''
        ], $options));

        if(!is_array($sort)){
            $sort = [$sort];
        }

        foreach ($sort as $_sort){
            if(in_array($_sort, array_keys(self::$allowedSortingOptions))){
                $parts = explode(' ', $_sort);

                if(count($parts) < 2){
                    array_push($parts, 'desc');
                }

                list($sortField, $sortDirection) = $parts;

                $query->orderBy($sortField, $sortDirection);
            }
        }

        if($genres !== null) {

            if(!is_array($genres)){
                $genres = [$genres];
            }

            foreach ($genres as $genre){
                $query->whereHas('genres', function($q) use ($genre){
                    $q->where('id', '=', $genre);
                });
            }

        }

        $lastPage = $query->paginate($perPage, $page)->lastPage();

        if($lastPage < $page){
            $page = 1;
        }

        if($year){
            $query->where('year', '=', $year);
        }

        return $query->paginate($perPage, $page);
    }
}

Список страниц заменил на кнопку, но как сделать чтобы данные подгружались, а не меняли содержимое?

sigalevoa , страница подгружается, но без фильтров.

Boarworm если заменить на '@#partialMovies', Load More работает, но тогда и фильтры подгружают страницу, а не обновляют.

Как вынести {% partial 'movies/paginate' %} из form_ajax (чтобы обновлять partialMovies через @), но сохранить при этом действия фильтров ?

Wildman к сожалению, нет (

Wildman спасибо, попробую в след. раз.

Wildman Супер!! сработало. Но как заменить paginate (список страниц) на кнопку?))