Fancybox를 사용하여 AJAX를 통해 게시 할 양식 데이터를 가져올 수 없습니다.

Question

Fancybox를 사용하여 링크를 클릭하면 연락처 양식이 팝업됩니다. 그런 다음 양식 데이터를 PHP 파일로 POST하고 전자 메일을 보내고 성공 메시지가 다시 나타납니다.

양식을 제출 한 후 페이지가 다시로드되고 데이터가 아무 곳에도없는 것으로 보입니다. AJAX를 사용하지 않고 양식을 제출하면 잘 작동하지만 새 페이지가로드됩니다.

형태 :

<div style="display:none"> 
    <div id="questions"> 
     <form id="question-form" action="" method="POST"> 
     <p>Name</p> <input type="text" name="name"> 
     <p>Email</p> <input type="text" name="email"> 
     <p>Item</p> <input type="text" name="item"> 
     <p>Message</p><textarea name="message" rows="6" cols="25"</textarea> 
     <br/> 
     <input type="submit" value="Send"> 
     </form> 
    </div> 
</div> 

스크립트 내가 잘못 뭐하는 거지

$("#question-form").bind("submit", function() { 

    $.fancybox.showActivity(); 

    $.ajax({ 
    type  : "POST", 
    cache  : false, 
    url   : "/includes/question-mailer.php", 
    data  : $(this).serializeArray(), 
    success  : function(data) { 
         $.fancybox(data); 
        } 
}); 

return false; 
}); 

?

Answer 1

간단한 실수였습니다. 위의 스크립트를 기본 팬시 상자 대신 <script> 태그에 넣는 대신 script을 붙였습니다. 최종 코드 :

<script type="text/javascript"> 
$(document).ready(function(){ 
    $("a.lightbox").fancybox({ 
     'transitionIn' : 'fade', 
     'transitionOut' : 'fade', 
     'speedIn'  : 600, 
     'speedOut'  : 200, 
     'overlayShow' : false 
    }); 

    $("#question-form").bind("submit", function() { 

     $.fancybox.showActivity(); 

     $.ajax({ 
      type  : "POST", 
      cache  : false, 
      url   : "/includes/question-mailer.php", 
      data  : $(this).serializeArray(), 
      success  :function(data){ 
          $.fancybox(data); 
         } 
     }); 

     return false; 
    }); 

});  
</script>