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 7 of 7
  1. #1
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    PHP Contact Form not submitting?

    For some stupid random reason, I can't get my PHP/jQuery form to work well together, it keeps taking me to the page that I am posting the data too, instead of actually doing it behind the scenes and giving me the result without any real browser movement to another page, I am so confused, can someone please shed some light on this for me?

    Here is my code...

    The form (index.php)
    Code:
    <script type="text/javascript">
    	$(document).ready(function(){
    		$("#emailform").validate({
    			debug: false,
    			rules: {
    				name: "required",
    				subject: "required",
    				message: "required",
    				email: {
    					required: true,
    					email: true
    				}
    			},
    			messages: {
    				name: "Please let us know who you are.",
    				email: "A valid email will help us get in touch with you.",
    				subject: "Without a subject selected, we can't fully categorise our support messages!",
    				message: "This must be full in order for us to understand yor issue."
    			},
    			submitHandler: function(form) {
    				// do other stuff for a valid form
    				$.post('process.php', $("#emailform").serialize(), function(data) {
    					$('#results').html(data);
    				});
    			}
    		});
    	});
    	</script>
    <form method='post' id='emailform' action='process.php'>
    <b>Name:</b>
    <br/>
    <input type='text' name='name' id='name'>
    <br/><br/>
    <b>E-mail Address:</b><br/>
    <input type='text' name='email' id='email'>
    <br/><br/>
    <b>Subject:</b><br/>
    <select name='subject' id='subject'><option value='Furniture Request'>Furniture Request</option></select><br/><br/>
    <b>Message:</b><br/><textarea cols='40' rows='5' onClick='this.value='';' onBlur='this.value='Type your message here...';' name='message' id='message'>Type your message here...</textarea><br/><br/>
    <input type='submit' name='send' value='Send'>&nbsp;<input type='reset' name='reset' value='Clear'>
    </form>
    </div>
    </center>
    </div>
    Here is the PHP (process.php)
    PHP Code:
    <?php
        $name 
    $_POST['name'];
        
    $email $_POST['email'];
        
    $subject $_POST['subject'];
        
    $message $_POST['message'];
        
    mail('EMAIL REMOVED FOR SECURITY','$subject','$message','From: $email');
        print
    "Congratulations, we've received your message! We'll get back to you via e-mail so be sure to keep checking for our reply!";
    ?>
    I'll be ever so grateful, thanks in advance!
    Last edited by TomAldy; 01-14-2013 at 05:01 PM.

  • #2
    Senior Coder DanInMa's Avatar
    Join Date
    Nov 2010
    Location
    Salem,Ma
    Posts
    1,577
    Thanks
    13
    Thanked 248 Times in 248 Posts
    you need to show the code for the rest of the page. Your code shown look correct so for some reason jquery is not handling your submittal process.

    Do you have any console errors?

  • #3
    Regular Coder
    Join Date
    Apr 2012
    Location
    St. Louis, MO
    Posts
    985
    Thanks
    7
    Thanked 101 Times in 101 Posts
    Your submit button is submitting the form. Change it to a type="button" and call the function from that.. or you might be able to use event.preventDefault().
    ^_^

    If anyone knows of a website that can offer ColdFusion help that isn't controlled by neurotic, pedantic jerks* (stackoverflow.com), please PM me with a link.
    *
    The neurotic, pedantic jerks are not the owners; just the people who are in control of the "popularity contest".

  • #4
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This is my code for the entire index.php...

    Code:
    <?php
    mysql_connect('localhost','root','');
    mysql_select_db('willows');
    $extensions = array("jpg","gif","png"); 
    $all_files = scandir("staff/products/"); 
    $images = array(); 
    for ($i=0;$i<count($all_files);$i++) 
        { 
        $is_image = false; 
        for ($x=0;$x<count($extensions);$x++) 
            { 
            if (substr_count(strtolower($all_files[$i]),$extensions[$x]) != 0) 
                { 
                $is_image = true; 
                break; 
                } 
            } 
        if ($is_image) array_push($images,$all_files[$i]); 
        } 
        ?>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>
    <?php
    $titlequery = mysql_query("SELECT * FROM `homepage`");
    while($title = mysql_fetch_array($titlequery))
    {
    	echo"$title[title]";
    }
    ?>
    </title>
    <link rel="stylesheet" type="text/css" href="files/css/style.css" />
    <!--[if IE]>
    <link rel="stylesheet" type="text/css" href="files/css/iestyle.css" />
    <![endif]-->
    <link rel="stylesheet" href="files/css/lightbox.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="files/css/nivo-slider.css" type="text/css" media="screen" />
    <script src="files/javascript/jquery-1.7.2.min.js"></script>
    <script src="files/javascript/jquery.nivo.slider.js"></script>
    <script src="files/javascript/jquery-ui-1.8.18.custom.min.js"></script>
    <script src="files/javascript/jquery.smooth-scroll.min.js"></script>
    <script src="files/javascript/lightbox.js"></script>
    <script src="files/javascript/scripts.js"></script>
    </head>
    <body>
    <center>
    <div id="contactform" style="width: 100%; position: absolute; top: 0px; left: 0px; z-index: 80; display: none; padding-top: 120px;">
    <center>
    <div id="form" style="background-color: #ffffff; border: 4px solid #13480B; padding: 10px; text-align: left; width: 400px;">
    <a style="cursor: pointer;"><img src="images/closeform.png" align="right" border="0" id="closeform" style="border: 2px solid black; padding: 1px;"></a>
    <b>Contact Form</b><br/><br/>
    Welcome to our contact form, we are always free to answer any questions, queries or interests you have in our stock or website! This form is connected directly to our e-mail inbox, therefore we will be sure to answer any questions you have  as soon as possible.<br/><br/>
    <div id="results"></div>
    <script type="text/javascript">
    jQuery.preloadImages = function()
    {
      for(var i = 0; i<arguments.length; i++)
      {
        jQuery("<img>").attr("src", arguments[i]);
      }
    }
    	$(document).ready(function(){
    		$("#emailform").validate({
    			debug: false,
    			rules: {
    				name: "required",
    				subject: "required",
    				message: "required",
    				email: {
    					required: true,
    					email: true
    				}
    			},
    			messages: {
    				name: "Please let us know who you are.",
    				email: "A valid email will help us get in touch with you.",
    				subject: "Without a subject selected, we can't fully categorise our support messages!",
    				message: "This must be full in order for us to understand yor issue."
    			},
    			submitHandler: function(form) {
    				// do other stuff for a valid form
    				$.post('process.php', $("#emailform").serialize(), function(data) {
    					$('#results').html(data);
    				});
    			}
    		});
    	});
    	</script>
    <form method='post' id='emailform' action='process.php'>
    <b>Name:</b>
    <br/>
    <input type='text' name='name' id='name'>
    <br/><br/>
    <b>E-mail Address:</b><br/>
    <input type='text' name='email' id='email'>
    <br/><br/>
    <b>Subject:</b><br/>
    <select name='subject' id='subject'><option value='Furniture Request'>Furniture Request</option></select><br/><br/>
    <b>Message:</b><br/><textarea cols='40' rows='5' onClick='this.value='';' onBlur='this.value='Type your message here...';' name='message' id='message'>Type your message here...</textarea><br/><br/>
    <input type='button' name='send' value='Send'>&nbsp;<input type='reset' name='reset' value='Clear'>
    </form>
    </div>
    </center>
    </div>
    <div id="menu">
    <div id="search" style="float: right;margin-top: -3px; margin-right: 10px;">
    <form method="get" action="http://www.google.com/search" target="_blank">
    <input type="text" value="Search..." name="q" id="search" onclick="this.value='';" onBlur="this.value='Search...';">
    <input type="submit" value="Go!">
    <input type="radio" style="display: none;" name="sitesearch" value="willowsgb.co.uk" checked/>
    </form>
    </div>
    <img src="images/willowsgb.png" width="100" height="20" border="0"  onMouseover="showmenu(event,linkset[1], '180px')" onMouseout="delayhidemenu()" style="margin-left: 10px;" />
    <img src="images/products.png" width="100" height="20" border="0"  onMouseover="showmenu(event,linkset[2], '180px')" onMouseout="delayhidemenu()" style="margin-left: 10px;" />
    <a href="#pagecontent" style="cursor: pointer;" onClick="mainContent('<b>Legislation!</b><br/><br/>As a company, legislation is very important to us, and we want to focus on the main aspects of it in case any problems or issues seem to arise within the time that you use our business. If you want to know all about your rights and what can be done if anything goes wrong on our part, then all you have to do is download our document explaining all the fundamentals you need to know about.<br/><br/>Downloading the information will take no longer than 30 seconds, we suggest you read it all through before trading or discussing business with us.');"><img src="images/legislation.png" width="100" height="20" border="0" style="margin-left: 10px;" /></a>
    <img src="images/links.png" width="100" height="20" border="0"  onMouseover="showmenu(event,linkset[3], '180px')" onMouseout="delayhidemenu()" style="margin-left: 10px;" />
    <a style="cursor: pointer;"><img src="images/contactus.png" width="100" height="20" border="0" id="contactbutton" style="margin-left: 10px;" /></a>
    </div>
    <div id="content">
    <div id="banner">
    <a href="index.html"><img src="images/logo.png" align="left" border="0" /></a>
    <div id="address"><br/>
    66 West Street<br/>
    Fareham<br/>
    PO16 0JR<br/>
    <strong>Tel:</strong> 01329 281889<br/> 
    <strong>Fax:</strong> 02380 335585<br/>
    <strong>Email:</strong> info@willowsgb.co.uk
    </div>
    </div>
    <center>
    <div id="products" style="display:block;" class="products">
    <div id="producttitle">Latest Products</div>
    <div class="imageRow">
    <div class="set">
    <div class="single">
    <div id="productlist">
    </div>
    </div>
    </div>
    </div>
    </div>
    <script type="text/javascript">
       $("#productlist").load('products/latest.php');
    function loadContent(page,title){
       $("#productlist").load(''+page+'');
       document.getElementById("producttitle").innerHTML = ''+title+'';
    }
    </script>
    </center>
    <div id="leftside">
    <div id="mainpicture">
    <div id="slider" class="nivoSlider">
                    <img src="images/photos/1.jpg" alt="" title="All the latest products you could ask for, right in front of your eyes." data-transition="boxRandom" />
                    <img src="images/photos/2.jpg" alt="" title="Want to see our products? Check out the link above!" data-transition="slideInLeft" />
                </div>
    </div>
    <div id="pagecontent">
    <b>Welcome to WillowsGB!</b><br/><br/>Hello there and welcome to the website of WillowsGB! A company that is catered to bringing you top quality furniture. We also offer a wide range of accessories and ornaments to make any room in your house look as good as possible.<br/><br/>If you have any questions at all then feel free to ask us on our contact page by clicking <u>here</u>, we will get back to you via e-mail and it will take 24 to 72 hours for us to reply, we are very busy!<br/><br/>We also have the option to download our brochures so you can take a browse through our beautiful collection, if you like our work then get in contact with us for a quote through the contact us form too!
    </div>
    </div>
    <div id="rightside">
    <div id="smallpicture">
    <div id="picturetitle">Bedroom</div>
    <img src="images/photos/bedroom.jpg" width="190" height="97"/>
    </div>
    <div id="smallpicture">
    <div id="picturetitle">Dining Room</div>
    <img src="images/photos/diningroom.jpg" width="190" height="97"/>
    </div>
    <div id="smallpicture">
    <div id="picturetitle">Living Room</div>
    <img src="images/photos/livingroom.jpg" width="190" height="97"/>
    </div>
    <div id="smallpicture">
    <div id="picturetitle">Accessories</div>
    <img src="images/photos/accessories.jpg" width="190" height="97"/>
    </div>
    </div>
    <div id="bottombar"></div>
    </div>
    </center>
    </div>
    <script>
      jQuery(document).ready(function($) {
          $('a').smoothScroll({
            speed: 1000,
            easing: 'easeInOutCubic'
          });
    
          $('.showOlderChanges').on('click', function(e){
            $('.changelog .old').slideDown('slow');
            $(this).fadeOut();
            e.preventDefault();
          })
      });
    
      var _gaq = _gaq || [];
      _gaq.push(['_setAccount', 'UA-2196019-1']);
      _gaq.push(['_trackPageview']);
    
      (function() {
        var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
        ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
        var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
      })();
        $(window).load(function() {
            $('#slider').nivoSlider();
        });
    $('#contactbutton').click(function() {
          $('#contactform').fadeIn('slow', function() {
          });
        });
    	$('#closeform').click(function() {
          $('#contactform').fadeOut('slow', function() {
          });
        });
        </script>
    
    </body>
    </html>
    Sorry it's so messy, I really need to tidy it up but that's everything in it, hopefully there is no interference in the code considering every other jQuery function works fine...

  • #5
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I have fixed this, please can someone close it?

  • #6
    Regular Coder
    Join Date
    Apr 2012
    Location
    St. Louis, MO
    Posts
    985
    Thanks
    7
    Thanked 101 Times in 101 Posts
    You have to edit your original post, and choose "Resolved" from the drop down next to the subject of your post.

    BTW.. how did you fix it?
    ^_^

    If anyone knows of a website that can offer ColdFusion help that isn't controlled by neurotic, pedantic jerks* (stackoverflow.com), please PM me with a link.
    *
    The neurotic, pedantic jerks are not the owners; just the people who are in control of the "popularity contest".

  • #7
    New to the CF scene
    Join Date
    Jan 2013
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I was using validate, which didn't exist!
    I had to add a plugin file so that jQuery could read the term 'validate'


  •  

    Posting Permissions

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