Submit button does nothing

Question

I have a submit button in a form and use PHP for scripting to email the form. When the button is pressed nothing happens, not even showing the PHP code like when PHP isn't installed. I have tested other simple mailing forms on machine and they show the code. This one does nothing.

HTML Code:

<form name="apply" method="post" action="mail.php">                 
<font class="error-message"></font>
    <div class="form-content">
        <div class="left-label">
            <label>First and Last name:</label>
            <label>School type:</label>
            <label>Practice name:</label>
            <label class="address">Address:</label>
    <label class="address2">Address (cont):</label>
    <label class="zip">Zip Code:</label>
    <label class="city">City:</label>
            <label>Website:</label>
            <label>Email:</label>
        </div>
        <div class="right-fields">                          
            <input type="text" name="fist-last-name" placeholder="First & Last name" title="Please enter First & Last name." />
            <select name="select-school">
                <option>--select--</option>
                <option>Dental Assistant School</option>
                <option>Medical Assistant School</option>
                <option>Pharmacy Technician School</option>
                <!-- <option>Personal Trainer School</option> -->
                <option>Other School</option>
            </select>
            <input type="text" name="practice-name" placeholder="Practice name" title="Please enter your practice name." />
            <textarea name="address1" placeholder="Address 1" title="Please enter address1"></textarea>
            <textarea name="address2" placeholder="Address 2" title="Please enter address2"></textarea>
            <div class="clear"></div>
            <input type="text" name="zipcode" placeholder="Zip Code" title="Please enter your zipcode." /><br>
            <input type="text" name="city" placeholder="City" title="Please enter the city where you live." />
            <input type="text" name="website-address" placeholder="Website" title="Please enter your website address." />
            <input type="text" name="email" placeholder="Email" title="Please enter your email address." />
            <input type="submit" value="Submit"/>
        </div>
    </div>
    <div class="clear"></div>
</form>

PHP code, mail.php :

<?php

$fist_last_name     = $_POST["fist-last-name"];

$school_type        = $_POST["select-school"];

$practice_name      = $_POST["practice-name"];

$address1           = $_POST["address1"];

$address2           = $_POST["address2"];

$zipcode            = $_POST["zipcode"];

$city               = $_POST["city"];

$website            = $_POST["website-address"];

$email              = $_POST["email"];


$body   = " <table>

                <tr><th>First Last name:</th><td>".$fist_last_name."</td></tr>

                <tr><th>School type:</th><td>".$school_type."</td></tr>

                <tr><th>Practice name:</th><td>".$practice_name."</td></tr>

                <tr><th>address1:</th><td>".$address1."</td></tr>

                <tr><th>address2:</th><td>".$address2."</td></tr>

                <tr><th>Zipcode:</th><td>".$zipcode."</td></tr>

                <tr><th>City:</th><td>".$city."</td></tr>

                <tr><th>Website:</th><td>".$website."</td></tr>

                <tr><th>Email:</th><td>".$email."</td></tr>

            </table>";

mail('emailaddress@domain.com','No Reply',$body,"From: noreply@domain.com");

?>

This is the JavaScript for the form validation:

/* Form validation */

$("form[name='apply']").submit(function(){
    var error = true;
    var text_fields = ["fist-last-name", "practice-name", "zipcode", "city", "website-address", "email"];
    $.each(text_fields,function(key,value){
        if(!$.trim($("input[name='"+value+"']").val()) == "") {
            $("input[name='"+value+"']").css({'border-color': '#ccc'});
        }
        else{
            $("input[name='"+value+"']").css({'border-color': 'red'});
            error = false;
        }
    });
    if($("form[name='apply'] select[name='select-school']").val() == "--select--") {
        $("form[name='apply'] select[name='select-school']").css({'border-color': 'red'});
        error = false;
    }
    else {
        $("form[name='apply'] select[name='select-school']").css({'border-color': '#ccc'});
    }
    var textarea_fields = ["address1", "address2"];
    $.each(textarea_fields,function(key,value){
        if(!$.trim($("form[name='apply'] textarea[name='"+value+"']").val()) == "" ) {
            $("form[name='apply'] textarea[name='"+value+"']").css({'border-color': '#ccc'});
        }
        else {
            $("form[name='apply'] textarea[name='"+value+"']").css({'border-color': 'red'});
            error = false;
        }
    });
    console.log(error);
    if(error == true) {
        $.post('mail.php',$("form[name='apply']").serialize(),function(data){
            console.log(data);
        });
    }
    return false;
});

$("form[name='apply'] input[type='text'], form[name='apply'] textarea").blur(function(){
    if($.trim($(this).val()) == ""){
        $(".error-message").text($(this).attr('title'));
        $(this).css({'border-color': 'red'});
    }
    else {
        $(this).css({'border-color': '#ccc'});
        $(".error-message").text('');
    }
});
$("form[name='apply'] input[type='text'], form[name='apply'] textarea").bind("keydown",function(){
    if($.trim($(this).val()) == ""){
        $(".error-message").text($(this).attr('title'));
        $(this).css({'border-color': 'red'});
    }
    else {
        $(this).css({'border-color': '#ccc'});
    }
});

The error occurs in this code:

$("form[name='apply']").submit(function(){
    var error = true;
    var text_fields = ["fist-last-name", "practice-name", "zipcode", "city", "website-address", "email"];
    $.each(text_fields,function(key,value){
        if(!$.trim($("input[name='"+value+"']").val()) == "") {
            $("input[name='"+value+"']").css({'border-color': '#ccc'});
        }
        else{
            $("input[name='"+value+"']").css({'border-color': 'red'});
            error = false;
        }
    });
    if($("form[name='apply'] select[name='select-school']").val() == "--select--") {
        $("form[name='apply'] select[name='select-school']").css({'border-color': 'red'});
        error = false;
    }
    else {
        $("form[name='apply'] select[name='select-school']").css({'border-color': '#ccc'});
    }
    var textarea_fields = ["address1", "address2"];
    $.each(textarea_fields,function(key,value){
        if(!$.trim($("form[name='apply'] textarea[name='"+value+"']").val()) == "" ) {
            $("form[name='apply'] textarea[name='"+value+"']").css({'border-color': '#ccc'});
        }
        else {
            $("form[name='apply'] textarea[name='"+value+"']").css({'border-color': 'red'});
            error = false;
        }
    });
    console.log(error);
    if(error == true) {
        $.post('mail.php',$("form[name='apply']").serialize(),function(data){
            console.log(data);
        });
    }
    return false;
}); 

Answer 1

Your Javascript is stopping the form from submitting. When you return false in a form's submit event, it prevents the form being submitted.

I think you want to return the error variable which seems to be a boolean to indicate a validation error.

Try:

$("form[name='apply']").submit(function(){

    .... JS code ....
    return error;
});

Using that, if there are no validation errors, the form will submit. Also your error boolean is slightly misleading, it would be more logical if error is true then there is a validation error, but you have it reversed - won't make any difference to the actual code execution, just a readability point.

Answer 2

Try if(isset($_POST['practice-name'])){ die('values posted'); }else{ die('nothing was posted'} if(isset($_POST['practice-name'])){ die('values posted'); }else{ die('nothing was posted'} and let us know what it does.

Answer 3

Firstly, try commenting out everything in mail.php and doing something really simple like:

<?php echo "This works!"; ?>

Just to see if it actually submits to the page. If it does, the problem would be with the 'post' variables or the input form. Try making a new html page with an input form to mail.php but with nothing else other than the textboxes and submit button. If it submits and mail.php receives all the data, the problem would have to do with something other than the files.

Hope this helps!

Answer 4

Since you said that the form does not get submitted at all - and I tested the code and it does submit the way it is - then you must have some JavaScript function or event listener that stops the form from being submitted .

Your HTML works and form submit does tell browser to submit the form. This can't be a PHP problem, since if submit does not even happen then PHP plays no role in this if the form itself is displayed correctly.