Javascript — передача параметра в модальное окно fancybox
posted in Javascript, Полезности, Программирование, Сайтостроение |Вроде элементарное ТЗ — а промучался полдня.
При клике на «купить» — должно появляться модальное окно «Товар добавлен в корзину» «продолжить покупки» «оформить заказ»
В качестве модального окошка решено использовать скриптик JancyBox — и центрируется и затемняет, в общем всё устраивает!
кроме одного НО! — при нажатии на «купить» товар сначала должен «упасть» в корзину, т.е. нужно вызвать соответствующую функцию с передачей в качестве параметра ID товара
|
1 2 |
<a class="modal" href="#inline" rel="1111">Buy 1111</a> <a class="modal" href="#inline" rel="2222">Buy 2222</a> |
|
1 2 3 4 5 6 |
$(".modal").fancybox({ 'onStart': function() { var id = $(this).attr('rel'); alert(id); } }); |
Так не пашет! — даёт «undefined»
Как вариант — повесить сначала click — в нём сделать нужный вызов, а потом открыть окно имитацией клика
$(«#id2»).trigger(‘click’);
|
1 2 3 4 5 |
$("#id1").click(function() { var id = $(this).attr('rel'); $("#inline1").html(id); $("#id2").trigger('click'); }); |
Но почему-то в таком варианте модальное окно выводится сначала вверх потом только центрируется. Облом!
Гуглим далее — нашел свою обработку Тайтла с помощью собственной фукнции вешаемой параметром TitleFormat
Внутри которой дёрнуть rel можно следующим образом $(currentArray[currentIndex]).attr(‘rel’)
Т.е. вместо задания тайтла я получу ID и вызову нужную мне функцию.
На этом «мудрёном» варианте и остановлюсь — через задний проход конечно, но работает 🙂
P.S.
С вопросом по решению проблемы я создал 3 поста на форумах
phpclub.ru
javascript.ru/forum/
forum.searchengines.ru
На первом ноль реакции, на втором попытались помочь — но безуспешно
На javascript.ru/forum — 200 % попадание в цель!
На основе моего вопроса был создан готовый рабочий пример! В личке вебмастер ответил на мой вопрос — откуда именно инфа с указанием прямых ссылок на нужный мне пример в мануале!
Собственно, как обычно
Рони ответил в ПМ — за что ему ещё раз огромное спасибо!
Как обычно — всё гениальное просто — «Meditate on documentation!»
Дока тут http://fancyapps.com/fancybox/
Пример с передачей ID тут http://jsfiddle.net/Se8Yu/