Filtering Ditto Listings with AJAX Category Selection in Evolution CMS

AJAX filtering is one of the fastest ways to make an Evolution CMS catalog feel more modern without rebuilding the whole page flow. A common pattern is to let the visitor change a category selector and then refresh only the Ditto output block.

The original frontend code sent the selected category ID with a simple AJAX request and replaced the result container:

$('#category-1').change(function(){
    var id_cat = $('#category-1').val();
    $.ajax({
        url:'[~726~]',
        type:'post',
        data:{'id_cat':id_cat},
        success:function(resp){
            $('#product-grid').html(resp);
        }
    });
});

On the server side, the page rendered Ditto with the selected parent as the listing source. The idea is simple and still useful: the page shell stays stable, while the product block is regenerated from live data.

The main complication is pagination. Once the content is being refreshed through AJAX, the page links also need to stay inside the same interaction model. Otherwise the first filtered page works and the second click falls back to a full-page request or broken navigation.

This is a good Evolution pattern because it keeps the listing logic in Ditto while adding a lighter user experience on top.