开发者

Form submitting with jQuery and sending with PHP.. Can't work out why its not sending

开发者 https://www.devze.com 2023-01-25 08:02 出处:网络
Console is not showing any errors, neither is Firebug so I\'m at a loss as to why this isn\'t working.

Console is not showing any errors, neither is Firebug so I'm at a loss as to why this isn't working.

My form:

<form action="" method="post" id="sendEmail">
    <div class="alignleft">
        <p><label for="order_ref">Photo ID:</label><input type="text" name="order_ref" id="order_ref" class="text smallinput" disabled="disabled" value="<? echo $ref; ?>"/></p>
        <p><label for="order_name">Full Name:</label><input type="text" name="order_name" id="order_name" class="text" tabindex="10" /></p>
        <p><label for="order_telephone">Contact Number:</label><input type="text" name="order_telephone" id="order_telephone" class="text" tabindex="20" /></p>
        <p><label for="order_email">Email Address:</label><input type="text" name="order_email" id="order_email" class="text" tabindex="30" /></p>
    </div>

    <div class="alignright">
        <p class="higher"><label for="order_message">Message</label><textarea name="order_message" id="order_message" class="uniform" tabindex="40"></textarea></p>
    </div>

    <div class="rounded color_grey"><p>Clicking confirm will mail your order to us. We'll be in touch shortly. <input type="submit" id="submit" name="submit" value="" class="alignright" /></p></div>
</form>

Then my JS:

// JavaScript Document

var g = jQuery.noConflict();

g(document).ready( function() {

    g("#submit").click(function(){                                     

        // set initial error value to false
        var hasError = false;

        // set var for each form field
        var order_ref = g("#order_ref").val();
        var order_name = g("#order_name").val();
        var order_telephone = g("#order_telephone").val();
        var order_email = g("#order_email").val();
        var order_message = g("#order_message").val();

        // validate each of them
        if(order_ref == '') { g("#order_ref").addClass('haserror'); hasError = true; } 
        if(order_name == '') { g("#order_name").addClass('haserror'); hasError = true; } 
        if(order_telephone == '') {  g("#order_telephone").addClass('haserror'); hasError = true; } 
        if(order_email == '') { g("#order_email").val().addClass(开发者_Go百科'haserror'); hasError = true; } 
        if(order_message == '') { g("#order_message").val().addClass('haserror'); hasError = true; } 

        // if there's no errors, proceed            
        if(hasError == false) {
            //alert('no errors');
            g.post("/photo/theme/foodphoto/includes/mail_send.php",
                { 
                    // pass each of the form values to the PHP file for processing
                    order_ref: order_ref, 
                    order_name: order_name, 
                    order_telephone: order_telephone, 
                    order_email: order_email, 
                    order_message: order_message
                },
                    function(data){
                        // no errors? great now do what you want to show the user his message is sent
                        alert('sent');
                    }
                 );
        }

        return false;
    }); 

});

And the PHP that should send it (mail_send.php)

<?php

    // receive & save each of the vars from the AJAX request
    $order_ref = $_POST['order_ref'];
    $order_name = $_POST['order_name'];
    $order_telephone = $_POST['order_telephone'];
    $order_email = $_POST['order_email'];
    $order_message = $_POST['order_message'];

    // setup the email requirements 
    $to = "email@address.com";
    $subject = "Order Has Been Placed";

    // what must be in the mail message
    $message = "The following order has been placed on your website:";

    $headers  = 'MIME-Version: 1.0' . "\r\n";
    $headers .= 'Content-type: text/html; charset=iso-8859-1' . "\r\n";
    $headers .= 'From: '.$order_name.' <'.$order_email.'>';

    mail($to, $subject, $message, $headers);

?>

Console reports no PHP issues and Firebug (I am new at using this, so I might have skipped something?) reports no issues...?

What am I doing wrong?


Don't use the .click handler when using an input type of submit. Switch it to

    g("#sendEmail").submit(function(){

Then see if when you click submit you invoke the JS as expected.


On a side note, you can reduce the amount of code that you write by serializing your form data with $(FORM ID or CLASS).serialize()

Cheers!


your js code is not called because you added submit button, when hit on that it will submit the form without waiting for a click event to be fired so either you change the button to click and then submit the form from click event or you can use submit an event

Cheers!

0

精彩评论

暂无评论...
验证码 换一张
取 消