window.addEventListener('DOMContentLoaded', (event) => {
  const button = document.getElementById('load-more-brochures');
  button.addEventListener('click', ajaxSubmit);
  let offset = 1;

  function ajaxSubmit() {
    // alert('ajaxSubmit');
    // var form = jQuery('#form');
    // var data = form.serialize();
    const ajaxUrl = ajaxSiteConfig?.ajaxUrl ?? '';
    const ajax_nonce = ajaxSiteConfig?.ajax_nonce ?? '';
    let ajaxPageData = {
      offset: offset,
    };
    jQuery.ajax({
      type: 'POST',
      url: ajaxUrl,

      data: {
        action: 'get_more_brochures', // the action to fire in the server
        ajax_data: ajaxPageData, // any JS object
      },
      complete: function (response) {
        if (response.responseJSON.data) {
          offset += 1;
          const container = document.querySelector('.brochures-grid'); // Replace this with the actual container element
          container.innerHTML += response.responseJSON.data; // Append the new content
          if (response.responseJSON.isQueryEmpty) {
            button.style.display = 'none';
          }
        }
      },
    });

    // return false;
  }
});
// url: ajaxurl,