Показывать подтверждение перед fancybox

Question

У меня есть приложение с клиентами, у которых есть задачи. Чтобы создать новую задачу для клиента, вы можете щелкнуть значок добавления, который открывает fancybox с новой формой задачи. У этого есть следующий сценарий кофе:

jQuery -> 
    $("a.fancyForm").fancybox 
    scrolling: "no" 
    titleShow: false 

Однако клиенты также должны иметь цель работать в противном случае, задачи не нужны. Таким образом, отношения на самом деле у клиента есть много целей, которые имеют много задач. Если у клиента уже есть некоторые цели, тогда форма просто спросит вас, к какой цели он стремится. Если у клиента нет цели, я хочу открыть окно подтверждения, которое спрашивает, хочет ли пользователь сделать цель сейчас. Это сценарий кофе я в настоящее время:

$("a.noGoals").click (e) -> 
    e.preventDefault() 
    confirm_create_goal = confirm("There is currently no Goal for this customer. Would you like to create one?") 
    if confirm_create_goal 
    $("a.noGoals").fancybox() 
    else 
    alert "You won't be able to create tasks until a goal is created!" 

Это вызывает окно подтверждения щелчка ОК, кажется, не делать ничего. Если вы затем попробуете второй раз, отобразится окно подтверждения, и если вы нажмете ok или отмените его, отобразится правильный fancybox с моей новой формой. Как мне заставить это работать в первый раз? Кажется, что при первом нажатии ok он устанавливает только confirm_create_goal, а затем во второй попытке открывается только fancybox.

Если я нажму «отменить» при первой попытке, он правильно отобразит предупреждение. Вторая попытка я ударил "нормально" без fancybox. Третья попытка ударить «хорошо» получить fancybox, но если я нажму «отменить», я получу предупреждение, а затем fancybox o.O

Answer 1

Так получается, что вызов FancyBox, как описано выше, просто присоединяет его к событию щелчка, не вызывает его. Поэтому, когда вы нажимаете снова, независимо от вашего ответа в поле подтверждения, он отображает fancybox, который теперь привязан к событию click.

Мое решение, хотя и не уверен, что это самое лучшее, заключается в использовании .on() и .off() для привязки и открепления окна подтверждения, тогда я могу запустить fancybox после $ ("a.noGoals"), .fancybox() вызов:

confirm_create_goal = (e) -> 
    e.preventDefault() 
    confirm_create = confirm("There is currently no Goal for " + $(this).data("customer") + "'s company, " + $(this).data("company") + ". Would you like to create one?") 
    if confirm_create 
    $("body").off "click", "a.noGoals", confirm_create_goal 
    $("a.noGoals").fancybox(onClosed: -> 
     $("body").on "click", "a.noGoals", -> 
     alert "Create a Goal!" 
    ).trigger "click" 
    else 
    alert "You won't be able to create tasks until a goal is created!" 

$("body").on "click", "a.noGoals", confirm_create_goal 

Так функция confirm_create_goal выскакивает окно подтверждения, которое дает предупреждение, если вы нажмете отменить, и если вы нажмете оК он отвязывает себя от ссылки, добавляет FancyBox и запускает событие щелчка на ссылка. Это открывает fancybox, и все отображается правильно. Наконец, я добавил предупреждение для привязки к ссылке (в случае, если пользователь закрывает ящик и пытается выполнить задачу), напомнив им создать цель.

Answer 2

fancybox() следует вызывать при загрузке страницы, а не в ответ на событие click. Вызов fancybox() просто создает fancybox и прикрепляет слушателей и т. Д. Он просто настраивает его. Он не показывает это.

Это одна из причин, по которой я не использовал fancybox, потому что это API - слабый соус. Нет способа его ручного отображения. Если вы используете FancyBox 2. Здесь не приводится пример того, как это может работать:

http://jsfiddle.net/9wAdV/1/