2017-10-05 5 views
0

wp contact 양식 7 및 fancy 상자에 문제가 있습니다. 양식을 제출 한 후에 숨겨진 콘텐츠를 표시해야합니다. 양식이 제출되면 해당 코드를 표시 할 수 없습니다.Wordpress contant 양식 7 및 fancy 상자를 사용하여 on_sent_ok 또는 fancybox를 닫을 때 특정 섹션을 표시하는 방법

<div class="col-md-offset-8 col-md-4 text-center"><a class="btn btn-primary show" data-fancybox="modal" data-src="#modal" href="javascript:;">View The Technical Specification </a></div> 

// Fancybox 모달

이 양식은 내가 여기에이

<div id="show" > 
    .................... 
     ............. 
    ....................... 
</div> 

같은 것을 표시 할 제출되면

<section> 
    <div id="modal" style="display: none; padding: 50px 5vw; max-width: 800px;text-align: center;"> 
       <h3>Provide the details</h3> 
     <?php echo do_shortcode('[contact-form-7 id="816" title="Download From"]'); ?> 

    </div> 
    </section> 

내가

$('.fancybox').fancybox({ 
      afterClose: function() { 
      $('#show').fadeIn(); // or .show() 
      }) 
     }); 

을 시도 스크립트입니다 나는 parti를 전시 할 수 없었다. cular section ..

답변

1

올바른 선택기를 사용하지 않아서 사용자 지정 옵션이 적용되지 않은 것처럼 보입니다. 그것은 다음과 같이해야합니다 :

$('[data-fancybox="modal"]').fancybox({ 
    afterClose: function() { 
    $('#show').show() 
    } 
}); 

데모 - 우리가 문의 양식 (7)를 제출하면 fancybox 양식 #modal 다음 URL이 http://demo.com/#modal 변경됩니다 활성화 된 경우 https://codepen.io/anon/pen/YrYqzy

+0

잘 했어! 내 자신을 닫을 때만 작동합니다. 폼이 fancybox를 제출했을 때'# show'가 작동해야하는 순간을 닫을 때 필요합니다. – Fussionweb

+0

하지만 문제가 어디에 있습니까? 양식 제출시 fancybox를 닫으십시오. 데모 버전을 업데이트했습니다. – Janis

+0

양식을 제출하면 fancybox가 닫힙니다. http : // demo.com/# modal을 http : // demo.com/# wpc7-fm으로 변경하면 fancybox가 사라집니다. 멋진 상자에 넣고 닫는다. 그 다음에는 양식이 그대로 있거나 자동으로 닫히고 숨겨진 내용을 표시해야합니다. – Fussionweb

0

가이 URL을 http://demo.com/에서 여기 http://demo.com/#wpc7-fm.로 리디렉션됩니다. 양식이 경우 URL이 http://demo.com/#wpc7-fm로 대체합니다 제출되면 우리 fancybox 인해 #wpc7 .`
예로 대체 URL을 #modal에 사라 것입니다 : - 코드 위

$('[data-fancybox="modal"]').fancybox({ 
afterClose: function() { 
$('#show').show() 
} 
}); 

그냥 $('#show').show()

그러나 이후 트리거 이 경우 코드 제출 양식이 비활성 상태가됩니다.

jQuery(document).ready(function() { 
if (location.hash != 0 && location.hash == '#wpcf7-fm'){ 

    $('#show').show(); 

    } 


}); 

이 위치 해시는 숨겨진 콘텐츠를 활성화 할 수 있습니다.