Pop-ups how to fix the conflict?

Question

JavaScript

Hello! Faced such difficulty, I use FancyBox (pop-up windows) The task from one product is to access the product ID twice, that is, first I need to call the feedback form only for this product, I do it like this

<a data-fancybox data-src="#" href="javascript:;">Заказать</a>

And then in the same product there is another button "Details"

<a data-fancybox data-src="#" href="javascript:;">Подробнее</a>

This is also a pop-up window, only with a description of the product, they naturally begin to conflict, because I turn to
How can I avoid this or somehow distinguish between
There are a lot of products on the page and each has its own

Answer 1

fancybox is so flexible...
Well, the main thing is that there is no conflict. On the first link and on the second one, you just open the same thing, and not as you wanted, but you programmed it that way yourself.
Your fancybox is initialized by the attribute data-fancybox. Convenient of course. Without writing a single line of code - fancybox works.
It doesn't work for you!!!
Remove this attribute, create a certain class, an attribute (choose the one you need) for the link type and hang your click handler on them. After checking the incoming data - open the right one.

Well, to help API - https://fancyapps.com/fancybox/3/docs/#api

Answer 2

A question from the category of wangani to me debugging. I suspect that you are looking for the tag using the data-src selector. Try to either change the tag or its content.