Подгрузка данных во View через Ajax

Обновляю данные на странице через форму

<form asp-action="GetTasks" asp-controller="Main" method="post" data-ajax="true" data-ajax-update="#taskList" data-ajax-loading="#spinner" data-ajax-success="filterOnSuccess">
   @await Component.InvokeAsync("Widget1")
   @await Component.InvokeAsync("Widget2")

   <button type="submit" id="applyFilterButton" class="wt-btn">Применить</button>
</form>

<div id="taskList" />

Обработка в контроллере

return PartialView("_ListTask", tasks);

Так же в Widget1 и Widget2 есть модели которые будут определять дальнейших поиск элементов при нажатии на кнопку.

Я хочу, что бы при пролистывании в конец отображаемого списка элементов, подгрузились следующие(например 10 штук). В данный момент я делаю это через Jquery, при этом заранее сохраняю в статиках свои значения из виджетов в контроллере.

$(window).scroll(function () {
        if ($(window).scrollTop() == $(document).height() - $(window).height()) {
            getNextTasks();
        }
    });

function getNextTasks() {
        $.ajax({
            type: "POST",
            url: "@Url.Action("GetNextTasks","Main")",
        }).done(function (result) {
            $('#taskList').append(result);
                });
    }

Возможно ли сделать такое что бы я вызывал нажатие кнопки applyFilterButton и модели автоматически собирались, при этом данные бы добавлялись(append) к , но если нажатие ручное то данные бы загружались по новой?