On Click Open Popup With Form And Then On Submit Download And Close It! How?

Here is what I am trying to do Click on download link. On click Popup will open. Contact form is in the popup. On submit button send mail and auto start download of PDF file. At t

Solution 1:

Browsers block popup windows because they are typically annoying and employed by malicious advertisements.

The better way to go about this is to use a modal window, which is basically the same as a popup, but instead of being a separate browser window, it's simply a separate element within the page that hovers above other content.

Solution 2:

Use bootstrap modal:

<script>
function send(){
var  name = $("input#name").val();
var  email = $("input#email").val();
$.ajax({
        type: "POST",
        url: "send.php", //your mailing code is place on send.php
        data:'name='+ name'&email='+email,
        success: function(data){
        $('#download').modal('hide');
        window.location.href='uploads/yourpdf.pdf'; //your file location        
            });
        }
}
</script>

The html code

<a href="#" class="btn btn-primary" data-toggle="modal" data-target="#download">Download</a>

<!-- modal for download and contact -->
<div class="modal fade" id="download" role="dialog" >
<div class="modal-dialog" >
<div class="modal-content">
<!-- Your contact form goes here --->
<form method="post">
<input type="text" id="name" placeholder="name">
<input type="text" id="email" placeholder="email">
<button onclick="send();">send</button>
</form>
</div></div></div>