Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4

Thread: Popup Form Help

  1. #1
    New Coder
    Join Date
    Jun 2009
    Posts
    50
    Thanks
    20
    Thanked 0 Times in 0 Posts

    Exclamation Popup Form Help

    Hi GUys,

    I recently just done a website for a client at www.smartinsuranceclaim.ie/newebsite on this website i have a page called "Make A Claim" this page is a pop up form that opens in on top of the page that the customer is on. Can someone please help me edit this pop up form first of all to include drop downs and second of all i want to be able to send this form to my email address.

    Heres the code for the Form now this will include dropdowns!!! -
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
    
    <link href="css/all.css" rel="stylesheet" type="text/css" media="all" />
    <link href="css/styles/spectrum/spectrum.css" rel="stylesheet" type="text/css" media="all" />
    <!-- layout style -->
    		<link href="css/reset.css" rel="stylesheet" type="text/css" media="screen" />
    		<link href="css/typography.css" rel="stylesheet" type="text/css" media="screen" />
    	    <link href="css/style.css" rel="stylesheet" type="text/css" media="screen" />	
    		<!-- jquery -->
    		<script type="text/javascript" src="scripts/jquery-1.2.6.min.js"></script>
    		<!-- superfish -->
    		<link rel="stylesheet" type="text/css" href="css/superfish.css" media="screen" />
    		<script type="text/javascript" src="scripts/hoverIntent.js"></script>
    		<script type="text/javascript" src="scripts/superfish.js"></script>
    		<!-- jcarousel -->
    		<script type="text/javascript" src="scripts/jquery.jcarousel.pack.js"></script>
    		<link rel="stylesheet" type="text/css" href="css/jquery.jcarousel.css" />
    		<link rel="stylesheet" type="text/css" href="css/skin.css" />
    		<!-- initialize slider -->
    	
    		<script type="text/javascript">
    
    			jQuery(document).ready(function() {
    			    jQuery('#mycarousel').jcarousel({
    			        vertical: true,
    			        scroll: 1
    			    });
    			});
    		
    		</script>
    		<!-- slider -->
    		<script type="text/javascript" src="scripts/easySlider1.5.js"></script>
    		<!-- initialize contact form -->
    		<script type="text/javascript" src="scripts/contact.js"></script>
    		<!-- initialize jquery plugins -->
    		<script type="text/javascript" src="scripts/init.js"></script>
    		<!--[if IE 6]>
    		<script src="scripts/dd_belated_png.js"></script>
    		<script>
    			DD_belatedPNG.fix('#top-items, #logo, #navmenu-container, #content-container-bg, #header-image-container, #prevBtn a, #nextBtn a, .comments, .post, #footer-container, .vertical-menu li, .vertical-menu li a, img, blockquote');
    			DD_belatedPNG.fix('.box-top, .box-center, .box-padding, .box-bottom');
    			DD_belatedPNG.fix('.box-2-top, .box-2-center, .box-2-padding, .box-2-bottom');
    			DD_belatedPNG.fix('.box-3-top, .box-3-center, .box-3-padding, .box-3-bottom');
    		</script>
    		<![endif]--> 
    </head>
    
    <body>
    	<div style="padding:15px;"><div id="note"></div>
    										<div id="fields">
    	<p>Please fill out the form below and we'll get back to you as soon as possible!</p>
    	<form action="javascript:alert('success!');">
    		<table>
    			<tr>
    		    	<td class="body" id="Company">
    		    	<strong><label for="Company">Company:</label></strong>
    		    	</td>
    		    
    		    	<td>
    		    	<input name="Company" type="text" size="50" />
    		    	</td>
    				</tr>
    			
    		    <tr>
    		        <td class="body" id="Contact">
    		        <strong><label for="Contact">Company Contact:</label></strong>
    		        </td>
    		        
    		        <td>
    		        <input name="Contact" type="text" size="50" />
    		        </td>
    		  	</tr>
    		  
    		  	<tr>
    		        <td class="body" id="Address">
    		        <strong><label for="Address">Address:</label></strong>
    		        </td>
    		        
    		        <td>
    		        <input name="Address" type="text" size="50" />
    		        </td>
    		  	</tr>
    		  	
    		    <tr>
    		        <td class="body" id="Phone">
    		        <strong><label for="Phone">Phone:</label></strong>
    		        </td>
    		        
    		        <td>
    		        <input name="Phone" type="text" size="50" />
    		        </td>
    		   </tr>
    		  	
    		    <tr>
    		        <td class="body" id="Email">
    		        <strong><label for="Email">Email:</label></strong>
    		        </td>
    		        <td>
    		        <input name="Email" type="text" size="50" />
    		        </td>
    		  	</tr>
    		  	
    		    <tr>
    		        <td class="body" id="Comments">
    		        <strong><label for="Comments">Questions/Comments:</label></strong>
    		        </td>
    		        <td>
    		        <textarea name="comments" cols="48" rows="6"></textarea>
    		        </td>
    		  	</tr>
    		    
    		  	<tr>
    		        <td></td>
    		        <td><input type="submit" value="Submit" id="submit" class="form-submit" /></td>
    		  	</tr>
    		</table>
    	</form>
    	</div>
    </body>
    </html>

    This is the php code. Please help me edit this in order to send all the details to my address.
    PHP Code:
    <?php

    /*
    Credits: Bit Repository
    URL: http://www.bitrepository.com/
    */

    include 'config.php';

    error_reporting (E_ALL E_NOTICE);

    $post = (!empty($_POST)) ? true false;

    if(
    $post)
    {
    include 
    'functions.php';

    $name stripslashes($_POST['name']);
    $email trim($_POST['email']);
    $subject stripslashes($_POST['subject']);
    $message htmlspecialchars($_POST['message']);


    $error '';

    // Check name

    if(!$name)
    {
    $error .= 'Please enter your name.<br />';
    }

    // Check email

    if(!$email)
    {
    $error .= 'Please enter an e-mail address.<br />';
    }

    if(
    $email && !ValidateEmail($email))
    {
    $error .= 'Please enter a valid e-mail address.<br />';
    }

    // Check message (length)

    if(!$message || strlen($message) < 10)
    {
    $error .= "Please enter your message. It should have at least 10 characters.<br />";
    }


    if(!
    $error)
    {
    $mail mail(WEBMASTER_EMAIL$subject$message,
         
    "From: ".$email."\r\n"
        
    ."Reply-To: ".$email."\r\n"
        
    ."X-Mailer: PHP/" phpversion());

    if(
    $mail)
    {
    echo 
    'OK';
    }

    }
    else
    {
    echo 
    '<div class="notification_error">'.$error.'</div>';
    }

    }
    ?>
    Someone Please Help!!

  • #2
    Super Moderator
    Join Date
    Feb 2009
    Location
    England
    Posts
    539
    Thanks
    8
    Thanked 63 Times in 54 Posts
    You're on the right track. Change the form to include method="post" and action="myphpfile.php". Drop-downs are simple enough, just give the <select> a name, and the $_POST variable will contain the selected <option>'s value.
    lamped.co.uk :: Design, Development & Hosting
    marcgray.co.uk :: Technical blog

  • Users who have thanked Lamped for this post:

    irishpeck (12-04-2010)

  • #3
    New Coder
    Join Date
    Jun 2009
    Posts
    50
    Thanks
    20
    Thanked 0 Times in 0 Posts
    Hey Lamped listen thanks for the reply but im pretty new to php and i dont really understand how to implement wat you said could you give me some guidance?? Thanks in advance!

  • #4
    Super Moderator
    Join Date
    Feb 2009
    Location
    England
    Posts
    539
    Thanks
    8
    Thanked 63 Times in 54 Posts
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
    
    <link href="css/all.css" rel="stylesheet" type="text/css" media="all" />
    <link href="css/styles/spectrum/spectrum.css" rel="stylesheet" type="text/css" media="all" />
    <!-- layout style -->
    		<link href="css/reset.css" rel="stylesheet" type="text/css" media="screen" />
    		<link href="css/typography.css" rel="stylesheet" type="text/css" media="screen" />
    	    <link href="css/style.css" rel="stylesheet" type="text/css" media="screen" />	
    		<!-- jquery -->
    		<script type="text/javascript" src="scripts/jquery-1.2.6.min.js"></script>
    		<!-- superfish -->
    		<link rel="stylesheet" type="text/css" href="css/superfish.css" media="screen" />
    		<script type="text/javascript" src="scripts/hoverIntent.js"></script>
    		<script type="text/javascript" src="scripts/superfish.js"></script>
    		<!-- jcarousel -->
    		<script type="text/javascript" src="scripts/jquery.jcarousel.pack.js"></script>
    		<link rel="stylesheet" type="text/css" href="css/jquery.jcarousel.css" />
    		<link rel="stylesheet" type="text/css" href="css/skin.css" />
    		<!-- initialize slider -->
    	
    		<script type="text/javascript">
    
    			jQuery(document).ready(function() {
    			    jQuery('#mycarousel').jcarousel({
    			        vertical: true,
    			        scroll: 1
    			    });
    			});
    		
    		</script>
    		<!-- slider -->
    		<script type="text/javascript" src="scripts/easySlider1.5.js"></script>
    		<!-- initialize contact form -->
    		<script type="text/javascript" src="scripts/contact.js"></script>
    		<!-- initialize jquery plugins -->
    		<script type="text/javascript" src="scripts/init.js"></script>
    		<!--[if IE 6]>
    		<script src="scripts/dd_belated_png.js"></script>
    		<script>
    			DD_belatedPNG.fix('#top-items, #logo, #navmenu-container, #content-container-bg, #header-image-container, #prevBtn a, #nextBtn a, .comments, .post, #footer-container, .vertical-menu li, .vertical-menu li a, img, blockquote');
    			DD_belatedPNG.fix('.box-top, .box-center, .box-padding, .box-bottom');
    			DD_belatedPNG.fix('.box-2-top, .box-2-center, .box-2-padding, .box-2-bottom');
    			DD_belatedPNG.fix('.box-3-top, .box-3-center, .box-3-padding, .box-3-bottom');
    		</script>
    		<![endif]--> 
    </head>
    
    <body>
    	<div style="padding:15px;"><div id="note"></div>
    										<div id="fields">
    	<p>Please fill out the form below and we'll get back to you as soon as possible!</p>
    	<form action="emailer.php" method="post">
    		<table>
    			<tr>
    		    	<td class="body" id="Company">
    		    	<strong><label for="Company">Company:</label></strong>
    		    	</td>
    		    
    		    	<td>
    		    	<input name="Company" type="text" size="50" />
    		    	</td>
    				</tr>
    			
    		    <tr>
    		        <td class="body" id="Contact">
    		        <strong><label for="Contact">Company Contact:</label></strong>
    		        </td>
    		        
    		        <td>
    		        <input name="Contact" type="text" size="50" />
    		        </td>
    		  	</tr>
    		  
    		  	<tr>
    		        <td class="body" id="Address">
    		        <strong><label for="Address">Address:</label></strong>
    		        </td>
    		        
    		        <td>
    		        <input name="Address" type="text" size="50" />
    		        </td>
    		  	</tr>
    		  	
    		    <tr>
    		        <td class="body" id="Phone">
    		        <strong><label for="Phone">Phone:</label></strong>
    		        </td>
    		        
    		        <td>
    		        <input name="Phone" type="text" size="50" />
    		        </td>
    		   </tr>
    		  	
    		    <tr>
    		        <td class="body" id="Email">
    		        <strong><label for="Email">Email:</label></strong>
    		        </td>
    		        <td>
    		        <input name="Email" type="text" size="50" />
    		        </td>
    		  	</tr>
    		  	
    		    <tr>
    		        <td class="body" id="Comments">
    		        <strong><label for="Comments">Questions/Comments:</label></strong>
    		        </td>
    		        <td>
    		        <textarea name="comments" cols="48" rows="6"></textarea>
    		        </td>
    		  	</tr>
    		    
    		  	<tr>
    		        <td></td>
    		        <td><input type="submit" value="Submit" id="submit" class="form-submit" /></td>
    		  	</tr>
    		</table>
    	</form>
    	</div>
    </body>
    </html>
    PHP Code:
    <?php 
    $webmaster_email 
    'PUT YOUR EMAIL HERE';

    /* 
    Credits: Bit Repository 
    URL: http://www.bitrepository.com/ 
    */ 

    include 'config.php'

    error_reporting (E_ALL E_NOTICE); 

    $post = (!empty($_POST)) ? true false

    if(
    $post

    include 
    'functions.php'

    $name stripslashes($_POST['name']); 
    $email trim($_POST['email']); 
    $subject stripslashes($_POST['subject']); 
    $message htmlspecialchars($_POST['message']); 


    $error ''

    // Check name 

    if(!$name

    $error .= 'Please enter your name.<br />'


    // Check email 

    if(!$email

    $error .= 'Please enter an e-mail address.<br />'


    if(
    $email && !ValidateEmail($email)) 

    $error .= 'Please enter a valid e-mail address.<br />'


    // Check message (length) 

    if(!$message || strlen($message) < 10

    $error .= "Please enter your message. It should have at least 10 characters.<br />"



    if(!
    $error

    $mail mail($webmaster_email$subject$message
         
    "From: ".$email."\r\n" 
        
    ."Reply-To: ".$email."\r\n" 
        
    ."X-Mailer: PHP/" phpversion()); 

    if(
    $mail

    echo 
    'OK'



    else 

    echo 
    '<div class="notification_error">'.$error.'</div>'



    ?>
    I've ignored some of the code that should need fixing, and I'll leave you to have that as a learning curve

    The PHP needs to be saved as emailer.php, and you need to change the first line to hold your email address.

    You should compare my version with your version to see what's changed, though I think it'll work now.
    lamped.co.uk :: Design, Development & Hosting
    marcgray.co.uk :: Technical blog


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •