item.php

<?php
$items = $functions->getItems();
$projects = $functions->getProjects();
$itemProjects = $functions->getItemNodes();
?>

<link rel="stylesheet" href="chosen_v1.8.5/chosen.css">

<div class="table-wrapper" id="table-top">
    <img class="settings" src="img/settings.png" alt="Nustatymai">
    <h2>Gaminys</h2>
    <table id="gaminys">
        <thead>
            <tr>
                <th>Pavadinimas</th>
                <th>Projektas</th>
                <th>Grupė</th>
                <th>Aprašymas</th>
                <th class="veiksmai-sm">Veiksmai</th>
            </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
    <div class="pagination-wrapper">
        <ul class="pagination"></ul>
    </div>
</div>
  <script src="chosen_v1.8.5/docsupport/jquery-3.2.1.min.js" type="text/javascript"></script>
  <script src="chosen_v1.8.5/chosen.jquery.js" type="text/javascript"></script>
  <script src="chosen_v1.8.5/docsupport/prism.js" type="text/javascript" charset="utf-8"></script>
  <script src="chosen_v1.8.5/docsupport/init.js" type="text/javascript" charset="utf-8"></script>
<script>
$(function () {
    submit();
    $('#search').on('change, input', function() {
        submit();
    });
    $('.pagination').on('click', function(e) {
        if ($(e.target).prop('tagName').toLowerCase() == 'li') {
            submit($(e.target).attr('data-page'));
            window.location = "#table-top";
        }
    });
})

function submit(page = false) {
    var get = getUrlVars();
    $.ajax({
        url: 'ajax_controller.php?page=getItemsData',
        type: 'post',
        data: $.param({ 'search': $('#search').val() })+'&'+$.param({ 'page': page }),
        async: true,
        success: function (result) {
            var result = JSON.parse(result);
            $('#gaminys tbody').html(result['result']);
            $('.pagination').html(result['pages']);
            $(".multiSelect").chosen({width: "100%"});
        },
    });
}

</script>