Как передать параметры в fancybox при выполнении AJAX запроса

Многие из вас слышали про библиотеку fancybox. Всё немного усложняется, если необходимо передать параметры, а затем, например, на PHP, обработать их.

jQuery Fancybox — как передать параметры из ajax?

Про AJAX уже было написано несколько статей и вы можете ознакомится с ними кликнув на соответствующую ссылку ЧАСТЬ 1 и ЧАСТЬ 2.

Пропустим момент где нужно подключать все необходимые файлы и начнем с момента когда у вас уже подключена jQuery, скрипт fancybox и его стили. Первое, что нам необходимо, это HTML, у нас есть некая ссылка:

Начинаем писать обработчик по клику:

Сам параметр можно записать как атрибут тега, вернем к HTML:

Если вы используете PHP, то в $myID находится переменная.

Пока что всё понятно, теперь взглянем на код целиком, а после, разберем детальней:

При помощи создания переменной, со значением из data-атрибута ( var $id = $(this).data(‘id’); ), мы передаем наш ID, который изначально получили при помощи PHP ($myID ).
Чтобы передать данные через ajax запрос, мы пишем:

А чтобы данные попали в fancybox, необходимо его вызвать в функции успеха, передав для нашего «всплывающего окна» полученный результат с той страницы, на которую мы передали параметр (в моем случае это ajax.php):

а дальше идут параметры, которые вы найдете в официальной документации.

Самые внимательные из вас поняли что сама библиотека не получила никаких параметров, кроме как «результат со страницы аякса». В этом и заключается вся хитрость 🙂 .

П.С. на странице ajax.php переменная находится в $_REQUEST[‘id’] (или $_POST[‘id’], ведь именно этот тип выставлен в скрипте).

автор: Dmitriy

Занимаюсь веб-разработкой с 2011 года. Посмотреть некоторые из моих работ, а также узнать чуть больше обо мне, вы можете на forwww.com/dmitriy/.

Какие услуги предоставляю:
- Создание сайтов, шаблонов и компонентов на 1С-Битрикс;
- Разработка функционала с нуля и доработка кода на уже созданных проектах;
- Адаптивная вёрстка макетов и натяжка на Битрикс;
- Парсинг файлов и выгрузка на сайт (форматы - CSV, XML, XLSX, JSON)
- Интеграции со сторонними сервисами по API;
- Многоязычные версии и многое другое.

Если у вас остались вопросы, свяжитесь со мной любым удобным для вас способом или оставьте комментарий внизу.
E-mail: dmitriyribka@gmail.com
Skype: cinemacreaterus

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *