...

View Full Version : php contact form to download file after submission



awaix
08-18-2012, 03:43 AM
Hi,
im trying to create a landing page which will allow users to fill in the form and when they submit the form they will be able to download a pdf file located in the server..

here is index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Download Free Guide</title>
<link rel="stylesheet" type="text/css" href="css/style.css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="./js/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="./js/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="./js/fancybox/jquery.fancybox-1.3.4.css" media="screen" />
<script type="text/javascript">
$(document).ready(function() {
$("#download").fancybox({
'titlePosition' : 'inside',
'transitionIn' : 'none',
'transitionOut' : 'none'
});
});
</script>
</head>

<div style="display: none;">
<div id="FormLightBox">
<div class="inner">

<h3 id="status" style="color:#F00; display:none;">Your Errors Here</h3>
<h3>Leave your details below to download your free Guide pdf file</h3>
<p><input type="text" id="name" class="input-text" placeholder="Name"/></p>
<p><input type="text" id="email" class="input-text" placeholder="E-mail"/></p>
<p><input type="text" id="postcode" class="input-text" placeholder="Postcode"/></p>
<p><input type="text" id="phone" class="input-text" placeholder="Telephone" onkeypress="return validnum(event)" /></p>
<p><input type="image" id="i" class="input-button" src="img/button-download-lager.png" onclick="getResponse()"/></p>

</div>
</div>
</div>
<script type="text/javascript">
function get(y){
return document.getElementById(y).value;
}
function getResponse(){
$.get("process.php", { name: get('name'), email: get('email'), postcode: get('postcode'), phone: get('phone') },
function(data){
if(data.status === false || data.status === 'false'){
return errorMsg(data.message);
}else{
errorMsg(data.message);
setTimeout(" offerDownloadAndClose()", 4000);
}
}, "json");
}
function errorMsg(msg){
$('#status').html(msg);
$('#status').slideDown('slow');
setTimeout("doHide('#status')", 3000);
}
function doHide(t){
$(t).slideUp('slow');
}
function offerDownloadAndClose(){
doHide('#fancybox-wrap, #fancybox-overlay');
window.location = 'process.php?file=true';
}
function validnum(evt){
var charCode;
charCode = (evt.which) ? evt.which : event.keyCode;
if ((charCode >= 48 && charCode <= 57) || charCode == 46 || charCode == 127 || charCode == 8)
{
return true;
}
else{
return false;
}
}
</script>



here is process.php

<?php error_reporting(0);
if(empty($_GET)){
echo json_encode(array('status'=> false, 'message' => 'Please Fill the complete form'));
exit;
}
if(isset($_GET['file'])){
$file = 'Guide.pdf'; // set absolute relative path to this file

header("Cache-Control: public");
header("Content-Description: File Transfer");
header("Content-Disposition: attachment; filename=$file");
header("Content-Type: application/pdf"); // this needs to be according to the file type such as for PDF use 'application/pdf'
header("Content-Transfer-Encoding: binary");
}


if(!isset($_GET['name']) || empty($_GET['name'])){
echo json_encode(array('status'=> false, 'message' => 'Please Fill the name'));
exit;
}elseif(strlen($_GET['name']) < 3){
echo json_encode(array('status'=> false, 'message' => 'Please Fill the valid name (minimum 3 cherecters)'));
exit;
}
if(!isset($_GET['email']) || empty($_GET['email'])){
echo json_encode(array('status'=> false, 'message' => 'Please Fill the email'));
exit;
}elseif(!ereg('[A-Za-z0-9_-]+\@[A-Za-z0-9_-]+\.[A-Za-z0-9_-]+', $_GET['email'])){
echo json_encode(array('status'=> false, 'message' => 'Invalid email address'));
exit;
}
if(!isset($_GET['postcode']) || empty($_GET['postcode']) || strlen($_GET['postcode']) < 3){
echo json_encode(array('status'=> false, 'message' => 'Please Fill the postcode'));
exit;
}
if(!isset($_GET['phone']) || empty($_GET['phone']) || strlen($_GET['phone']) < 11){
echo json_encode(array('status'=> false, 'message' => 'Please Fill the phone'));
exit;
}elseif(strlen(str_replace(' ', '',$_GET['phone'])) > 11){
echo json_encode(array('status'=> false, 'message' => 'Please Fill with valid (max)11 digit phone number excluding spaces'));
exit;
}

$to = 'name@domain.com';
$subject = 'This will be the subject of that email';
$message = "Some one at your website just downloaded the guide with following details. \r\n \r\n";
$message .= 'Name: '.$_GET['name']." \r\n";
$message .= 'Email: '.$_GET['email']." \r\n";
$message .= 'PostCode: '.$_GET['postcode']." \r\n";
$message .= 'Phone: '.$_GET['phone']." \r\n";

$headers = 'From: '.$_GET['email']. "\r\n" .
'Reply-To: '.$_GET['email']. "\r\n" .
'X-Mailer: PHP/' . phpversion();

mail($to, $subject, $message, $headers);
echo json_encode(array('status'=> true, 'message' => 'Thank You'));
exit;
?>

there is no issue in submitting the details to email but when they get file to download, it doesn't download the file properly.. its always corrupted at 49bytes

please if someone can point out the issue and help me sort it out..would really appreciate it..

thanks..
p.s. not really good at php so please help me out.

DrDOS
08-18-2012, 04:29 AM
Just make a download.php file. It needs to be by itself, with nothing before or after the php tags, and called by a simple href link.




<?php
// We'll be outputting a PDF
header('Content-type: application/pdf');

// It will be called downloaded.pdf
header('Content-Disposition: attachment; filename="downloaded.pdf"');

// The PDF source is in original.pdf
readfile('original.pdf');
?>

awaix
08-18-2012, 05:17 AM
got it fixed using the following code:


if(empty($_GET)){
echo json_encode(array('status'=> false, 'message' => 'Please Fill the complete form'));
exit;
}
if(isset($_GET['file'])){
$filename = 'guide.pdf'; // set absolute relative path to this file
$path = $_SERVER['DOCUMENT_ROOT']."/epc-guide/";
$fullpath = $path.$filename;
// required for IE, otherwise Content-disposition is ignored
if(ini_get('zlib.output_compression'))
ini_set('zlib.output_compression', 'Off');
header("Pragma: public"); // required
header("Expires: 0");
header("Cache-Control: must-revalidate, post-check=0, pre-check=0");
header("Cache-Control: private",false); // required for certain browsers
header("Content-Transfer-Encoding: binary");
header("Content-Type: application/pdf");
header('Content-Disposition: attachment; filename="'.$filename.'"');
header("Content-Length: ".filesize($fullpath));
readfile($fullpath);
}

now facing another issue if anyone can help...

when i browse the same page on mobile browser, the ajax contact form doesn't stand still at one place.. when i start typing anything in it, it starting juggling and move to down side extending the page.
and when i click on submit, instead of downloading the file it just open it up on the same page (the pdf file).

how can i make the box stand still in one place in mobile browser? and how to force it download the file even on mobile devices.

thanks :)

edited note: downloading issue is only on ios not on android, but form juggling issue is on both ios and android.

awaix
08-24-2012, 04:14 AM
Hi,
i was able to solve the above problem too..

have one more question thou... if anyone can help me.. is it possible to save all the submissions in sql database for a backup as well as to be used with other programs later?
idea is that when someone fills out a form, they get the file for download and their details from the form are emailed to me but i also want it to store on sql database..

please if someone can help me out here :) would really appreciate it..
thanks.

Got it working too.. but with an error.. the form is suppose to show error if any of the field is empty.. but it still insert an empty row in the database.
where as it should just show error and not insert anything if the fields fail to validate.

here is the code im using (process.php):


<?php error_reporting(0);

if(empty($_GET)){
echo json_encode(array('status'=> false, 'message' => 'Please Fill the complete form'));
exit;
}
//database insertion
$con = mysql_connect("localhost","mysql_user","mysql_pwd");
if (!$con)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db("mysql_database", $con);
$sql="INSERT INTO formdata (name, email, postcode, phone) VALUES ('$_GET[name]','$_GET[email]','$_GET[postcode]','$_GET[phone]')";
if (!mysql_query($sql,$con))
{
die('Error: ' . mysql_error());
}
mysql_close($con);

// download function
if(isset($_GET['file'])){
$filename = 'Guide.pdf'; // set absolute relative path to this file
$path = $_SERVER['DOCUMENT_ROOT']."/download/";
$fullpath = $path.$filename;
// required for IE, otherwise Content-disposition is ignored
if(ini_get('zlib.output_compression'))
ini_set('zlib.output_compression', 'Off');
header("Pragma: public"); // required
header("Expires: 0");
header("Cache-Control: must-revalidate, post-check=0, pre-check=0");
header("Cache-Control: private",false); // required for certain browsers
header("Content-Transfer-Encoding: binary");
header("Content-Type: application/pdf");
header('Content-Disposition: attachment; filename="'.$filename.'"');
header("Content-Length: ".filesize($fullpath));
readfile($fullpath);
}

if(!isset($_GET['name']) || empty($_GET['name'])){
echo json_encode(array('status'=> false, 'message' => 'Please Fill the name'));
exit;
}elseif(strlen($_GET['name']) < 3){
echo json_encode(array('status'=> false, 'message' => 'Please Fill the valid name (minimum 3 cherecters)'));
exit;
}
if(!isset($_GET['email']) || empty($_GET['email'])){
echo json_encode(array('status'=> false, 'message' => 'Please Fill the email'));
exit;
}elseif(!ereg('[A-Za-z0-9_-]+\@[A-Za-z0-9_-]+\.[A-Za-z0-9_-]+', $_GET['email'])){
echo json_encode(array('status'=> false, 'message' => 'Invalid email address'));
exit;
}
if(!isset($_GET['postcode']) || empty($_GET['postcode']) || strlen($_GET['postcode']) < 3){
echo json_encode(array('status'=> false, 'message' => 'Please Fill the postcode'));
exit;
}
if(!isset($_GET['phone']) || empty($_GET['phone']) || strlen($_GET['phone']) < 11){
echo json_encode(array('status'=> false, 'message' => 'Please Fill the phone'));
exit;
}elseif(strlen(str_replace(' ', '',$_GET['phone'])) > 11){
echo json_encode(array('status'=> false, 'message' => 'Please Fill with valid (max)11 digit phone number excluding spaces'));
exit;
}

$to = 'name@domain.com';
$subject = 'Guide has been downloaded';
$message = "Some one at your website just downloaded the guide with following details. \r\n \r\n";
$message .= 'Name: '.$_GET['name']." \r\n";
$message .= 'Email: '.$_GET['email']." \r\n";
$message .= 'PostCode: '.$_GET['postcode']." \r\n";
$message .= 'Phone: '.$_GET['phone']." \r\n";

$headers = 'From: '.$_GET['email']. "\r\n" .
'Reply-To: '.$_GET['email']. "\r\n" .
'X-Mailer: PHP/' . phpversion();

mail($to, $subject, $message, $headers);
echo json_encode(array('status'=> true, 'message' => 'Thank You'));
exit;
?>

Contact Form (index.html)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Download Free Guide</title>
<link rel="stylesheet" type="text/css" href="css/style.css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="./js/fancybox/jquery.mousewheel-3.0.4.pack.js"></script>
<script type="text/javascript" src="./js/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
<link rel="stylesheet" type="text/css" href="./js/fancybox/jquery.fancybox-1.3.4.css" media="screen" />
<script type="text/javascript">
$(document).ready(function() {
$("#download").fancybox({
'titlePosition' : 'inside',
'transitionIn' : 'none',
'transitionOut' : 'none'
});
});
</script>
</head>

<div style="display: none;">
<div id="FormLightBox">
<div class="inner">

<h3 id="status" style="color:#F00; display:none;">Your Errors Here</h3>
<h3>Leave your details below to download your free Guide pdf file</h3>
<p><input type="text" id="name" class="input-text" placeholder="Name"/></p>
<p><input type="text" id="email" class="input-text" placeholder="E-mail"/></p>
<p><input type="text" id="postcode" class="input-text" placeholder="Postcode"/></p>
<p><input type="text" id="phone" class="input-text" placeholder="Telephone" onkeypress="return validnum(event)" /></p>
<p><input type="image" id="i" class="input-button" src="img/button-download-lager.png" onclick="getResponse()"/></p>

</div>
</div>
</div>
<script type="text/javascript">
function get(y){
return document.getElementById(y).value;
}
function getResponse(){
$.get("process.php", { name: get('name'), email: get('email'), postcode: get('postcode'), phone: get('phone') },
function(data){
if(data.status === false || data.status === 'false'){
return errorMsg(data.message);
}else{
errorMsg(data.message);
setTimeout(" offerDownloadAndClose()", 4000);
}
}, "json");
}
function errorMsg(msg){
$('#status').html(msg);
$('#status').slideDown('slow');
setTimeout("doHide('#status')", 3000);
}
function doHide(t){
$(t).slideUp('slow');
}
function offerDownloadAndClose(){
doHide('#fancybox-wrap, #fancybox-overlay');
window.location = 'process.php?file=true';
}
function validnum(evt){
var charCode;
charCode = (evt.which) ? evt.which : event.keyCode;
if ((charCode >= 48 && charCode <= 57) || charCode == 46 || charCode == 127 || charCode == 8)
{
return true;
}
else{
return false;
}
}
</script>

please if someone can point out the issue which is adding empty row in the database



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum