01.11.2011, 11:18
|
Новичок на форуме
|
|
Регистрация: 01.11.2011
Сообщений: 3
|
|
в содержимом окна FancyBox не работает событие .click()
Создаю окно.
$(document).ready(function ()
{
$("#modal_box").fancybox({
imageScale : false,
overlayShow : true, // затемнять фон
hideOnOverlayClick :false, // клик вне окна
hideOnContentClick: false, // клик по окну
centerOnScroll : false,
titleShow: false // не выводить тайтл
});
});
в него грузится ХТМЛ форма добавления юзера. Пример:
<input type="text" id="user_name" style="width:300px"/>
<input type="text" id="user_password" style="width:300px"/>
<input type="text" id="start_date" name="start_date" style="width:300px"/>
<input type="submit" value="Добавить" onClick="AddNewUser();" id="add_button"/>
В этой форме к полю
<input type="text" id="start_date" name="start_date" style="width:300px"/>
привязан плагин .datepicker() :
$(function() {
var DateFormat = {
nextText : "»", prevText : "«", currentText : "Today", monthNames : ["Январь",
"Февраль", "Март", "Апрель", "Май", "Июнь", "Июль", "Август", "Сентябрь", "Октябрь", "Ноябрь",
"Декабрь"], monthNamesShort : ["Янв", "Фев", "Мар", "Апр", "Май", "Июн", "Июл", "Авг", "Сен",
"Окт", "Ноя", "Дек"], dayNames : ["Воскресенье", "Понедельник", "Вторник", "Среда", "Четверг",
"Пятница", "Суббота"], dayNamesShort : ["Вос", "Пон", "Вто", "Сре", "Чет", "Пят", "Суб"],
dayNamesMin : ["Вс", "Пн", "Вт", "Ср", "Чт", "Пт", "Сб"], dateFormat : "dd/mm/yy", firstDay : 0,
isRTL : false
};
$("#start_date").datepicker(DateFormat);
});
Событие .click() не работает, соответственно и модуль тоже.
Иду дальше и для проверки я просто создаю событие .ckick() любой объект подгружаемый в модальное окно. На кнопку отправления данных в обработчик
<input type="submit" value="Добавить" onClick="AddNewUser();" id="add_button"/>
я вешаю событие
$(document).ready(function (){
$("#modal_box").fancybox({
imageScale : false,
overlayShow : true, // затемнять фон
hideOnOverlayClick :false, // клик вне окна
hideOnContentClick: false, // клик по окну
centerOnScroll : false,
titleShow: false // не выводить тайтл
});
$("#add_button").click(function(){
alert('рабоает!');
});
});
и опять не работает. Возникает вопрос - почему?
Данные не в iframe и, по идее, все должно быть нормально, но увы это не так.
Может ли быть причина в том, что я склеиваю код JS из разных файлов?
т.е. у меня несколько
$(document).ready(function (){ ... });
|
|
01.11.2011, 11:52
|
|
Профессор
|
|
Регистрация: 09.11.2009
Сообщений: 1,101
|
|
Насколько мне известно, fancybox копирует указанный вами блок в свой контент, а значит что получается как бы создается новый элемент, а значит после открытия окна вам надо заново прописать обработчики.
У fancybox есть какое то событие которое указывает что окно загружено
__________________
"Всегда пишите код так, будто сопровождать его будет склонный к насилию психопат, который знает, где вы живете."
Мой сертификат :-D клацай
|
|
01.11.2011, 16:30
|
Новичок на форуме
|
|
Регистрация: 01.11.2011
Сообщений: 3
|
|
Событие называется вроде...
onComplete : function() {
(...)
}
... должно говорить что окно загружено и робота скрипта закончена.
Но как компактно прописывать заново все обработчики? если их может быть куча... хм.
|
|
01.11.2011, 16:39
|
Новичок на форуме
|
|
Регистрация: 10.10.2011
Сообщений: 8
|
|
$("#add_button").live('click', function(){
alert('работает!');
});
|
|
01.11.2011, 16:59
|
Новичок на форуме
|
|
Регистрация: 01.11.2011
Сообщений: 3
|
|
walik,
Работает! Спасибо.
Выкладываю мой готовый вариант.
$("#modal_box").fancybox({
imageScale : false,
overlayShow : true, // затемнять фон
hideOnOverlayClick :false, // клик вне окна
hideOnContentClick: false, // клик по окну
centerOnScroll : false,
titleShow: false, // не выводить тайтл
onComplete: function(){
var DateFormat =
{
nextText : "»", prevText : "«", currentText : "Today", monthNames : ["Январь",
"Февраль", "Март", "Апрель", "Май", "Июнь", "Июль", "Август", "Сентябрь", "Октябрь", "Ноябрь",
"Декабрь"], monthNamesShort : ["Янв", "Фев", "Мар", "Апр", "Май", "Июн", "Июл", "Авг", "Сен",
"Окт", "Ноя", "Дек"], dayNames : ["Воскресенье", "Понедельник", "Вторник", "Среда", "Четверг",
"Пятница", "Суббота"], dayNamesShort : ["Вос", "Пон", "Вто", "Сре", "Чет", "Пят", "Суб"],
dayNamesMin : ["Вс", "Пн", "Вт", "Ср", "Чт", "Пт", "Сб"], dateFormat : "dd/mm/yy", firstDay : 0,
isRTL : false
/*closeText : "Done", prevText : "Prev", nextText : "Next", currentText : "Today", monthNames : ["January",
"February", "March", "April", "May", "June", "July", "August", "September", "October", "November",
"December"], monthNamesShort : ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep",
"Oct", "Nov", "Dec"], dayNames : ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday",
"Friday", "Saturday"], dayNamesShort : ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
dayNamesMin : ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], dateFormat : "mm/dd/yy", firstDay : 0,
isRTL : false*/
};
$("#dob").datepicker(DateFormat);
$("#start_date").datepicker(DateFormat);
$("#fire_date").datepicker(DateFormat);
}
});
|
|
|
|