Server Side Pagination

Add server property to the pagination config to enable server-side pagination. Also, make sure the total property is correctly defined in the main server config block:

Live Editor

const paginator = new Paginator({
    columns: ['Pokemon', 'URL'],
    pageSize: 5,
    server: {
        param: {
            method: 'GET',
        },
        url: 'https://pokeapi.co/api/v2/pokemon',
        processData: (data) =>
            data.results.map((pokemon) => [
                pokemon.name,
                html(`<a href=${pokemon.url}>Link to ${pokemon.name}</a>`),
            ]),
        total: (data) => data.count,
        pageUrl: (prev, page, limit) =>
            `${prev}?limit=${limit}&offset=${page * limit}`,
    },
    dataRender: (response) => {
        let dataHtml = '<ul>';
        response.forEach((item, index) => {
            dataHtml += '<li><span>' + item[0] + '</span> ' + item[1].props.content + '</li>';
        });
        dataHtml += '</ul>';
        document.querySelectorAll('div.list-container')[0].innerHTML = dataHtml;
    }
});

Result

tip

You can also send POST HTTP calls if you add method: 'POST' to the main server config.