Fancybox ajax request how to get link attribute?

Question

JavaScript

Hello. I use the @fancyapps/fancybox library on the site. Popups are opened by Ajax request.
Let's say there is a link -

<a class = "js-fancybox-ajax" data-type="ajax" data-src="../backend/login-form.html" href="javascript:;">Войти</a>

The address in the data-src attribute for testing, will change later of course.

The crux of the matter is that I use several identical links on the site with the same data-src, when I click on the link, I want to open a popup, receiving content through an ajax request, passing in addition the attribute of the specific clicked link in the ajax "data" property. How to do it?

fancybox code -

$(function() {
    $().fancybox({
        'selector': '.js-fancybox-ajax',
        'touch': false,
        'hideScrollbar': false,
        ajax: {
            settings: {
                data: {'id': 123},
            }
        },
    });
});

I want to pass a specific data attribute of the clicked link instead of "123"

Answer 1

$('.js-fancybox-ajax').on('click', function(e){
  e.preventDefault();
  var $this = $(this),
    data = $this.data();
  $.fancybox.open({
    src: data.src,
    'touch': false,
    'hideScrollbar': false,
    ajax: {
      settings: {
        // Отправить всю data или (лучше) собрать новую из нужных аттрибутов
        data: data,
      }
    }
    // И т. д опции открытия fancybox
  });
  return !1;
});