PHP form with javascript button - not working

Question

I'm having some problems with a PHP form which should email values entered by a user to a specific email address. I've got a very similar form on my website which uses the same JS and PHP and works fine. I have copied the JS/PHP/HTML but just can't get it singing and dancing. I don't get any error messages, so I'm not even sure where the process is falling over.

I have used and abused Stackoverflow many times, but I just can't get my head around this one.

Form:

    <h2 class="module-title">Application Form</h2>

      <div class="content"><p>*Denotes required fields.</p></div>

<form action="/wp-content/themes/default/php/form.apply.php" method="post" name="application" id="application">

          <div class="module-field-list">

            <ul>

              <li class="field-375">

                <div class="field">

                  <label for="apply-surname" class="field-label">Surname</label>

                  <input name="apply-surname" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-firstname" class="field-label">First Name</label>

                  <input name="apply-firstname" type="text" placeholder="">

                  </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-previousnames" class="field-label">Previous Names</label>

                  <input name="apply-previousnames" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-agesept1st" class="field-label">Age at 1st September</label>

                  <input name="apply-agesept1st" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-dob" class="field-label">Date of Birth</label>

                  <input name="apply-dob" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-address" class="field-label">Address</label>

                  <input name="apply-address" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-postcode" class="field-label">Postcode</label>

                  <input name="apply-postcode" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-hometel" class="field-label">Home Telephone</label>

                  <input name="apply-hometel" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-mobile" class="field-label">Mobile Telephone</label>

                  <input name="apply-mobile" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-email" class="field-label">Email Address</label>

                  <input name="apply-email" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-gender" class="field-label">Gender</label>

                  <input name="apply-gender" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-nationality" class="field-label">Nationality</label>

                  <input name="apply-nationality" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-outsideeea" class="field-label">Have you ever lived outside the EEA?</label>

                  <input name="apply-outsideeea" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-outsideeeadates" class="field-label">Dates lived outside the EEA</label>

                  <input name="apply-outsideeeadates" type="text" placeholder="">

                </div>

              </li>

              <li class="field-750">

                <div class="field">

                  <label for="apply-medical" class="field-label">XYZ is committed to supporting all of our students. If you have a disability, medical condition or learning difficulty (such as dyslexia, Asperger's, etc) please state</label>

                  <input name="apply-medical" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-sen" class="field-label">Do you have a SEN statement or S139a?</label>

                  <input name="apply-sen" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-ethnic" class="field-label">What is your Ethnic background?</label>

                  <input name="apply-ethnic" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-predictedgrades" class="field-label">What are your predicted grades?</label>

                  <input name="apply-predictedgrades" type="text" placeholder="">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-coursechoice" class="field-label">At this stage, are you fairly sure which course you wish to take at XYZ?</label>

                  <input name="apply-coursechoice" type="text" placeholder="">

                </div>

              </li>

              <li class="field-750">

                <div class="field">

                  <label for="apply-asa2" class="field-label">AS/A2 levels</label>

                  <input name="apply-asa2" type="text" placeholder="In order of preference, please list a minimum of four subjects you are considering taking">

                </div>

              </li>

              <li class="field-750">

                <div class="field">

                  <label for="apply-voc" class="field-label">Vocational</label>

                  <input name="apply-voc" type="text" placeholder="Please state the exact title as it appears in the prospectus, for example Travel and Tourism BTEC Level 1 Diploma">

                </div>

              </li>

              <li class="field-375">

                <div class="field">

                  <label for="apply-nocourse" class="field-label">If you have answered no, please list the courses below you may be considering</label>

                  <input name="apply-nocourse" type="text" placeholder="">

                </div>

              </li>

              <li class="field-750">

                <div class="field">

                  <label for="apply-career" class="field-label">Do you have any career ideas? If so, what are they?</label>

                  <input name="apply-career" type="text" placeholder="">

                </div>

              </li>

              <li class="field-750">

                <div class="field">

                  <label for="apply-other" class="field-label">Other relevant information that you feel may assist us with helping you make the right course decision</label>

                  <input name="apply-other" type="text" placeholder="i.e work experience, part-time employment, voluntary work">

                </div>

              </li>





            </ul>

          </div>



       <div class="loader"></div>

       <div class="module-messages">

          <ul id="contact-messages">

          </ul>

        </div>



<div class="module-button"><a id="apply-submit">Apply</a></div>

       </form>

      </div>

PHP:

<?php

// Receiving variables

@$surname = htmlspecialchars($_POST['apply-surname']);
@$firstname = htmlspecialchars($_POST['apply-firstname']);
@$previousnames = htmlspecialchars($_POST['apply-previousnames']);
@$agesept1st = htmlspecialchars($_POST['apply-agesept1st']);
@$dob = htmlspecialchars($_POST['apply-dob']);
@$homeaddress = htmlspecialchars($_POST['apply-address']);
@$postcode = htmlspecialchars($_POST['apply-postcode']);
@$hometel = htmlspecialchars($_POST['apply-hometel']);
@$mobile = htmlspecialchars($_POST['apply-mobile']);
@$email = htmlspecialchars($_POST['apply-email']);
@$gender = htmlspecialchars($_POST['apply-gender']);
@$uln = htmlspecialchars($_POST['apply-uln']);

@$nationality = htmlspecialchars($_POST['apply-nationality']);
@$oustideeea = htmlspecialchars($_POST['apply-outsideeea']);
@$outsideeeadates = htmlspecialchars($_POST['apply-outsideeeadates']);
@$secondaryschools = htmlspecialchars($_POST['apply-secondaryschools']);

@$medical = htmlspecialchars($_POST['apply-medical']);
@$sen = htmlspecialchars($_POST['apply-sen']);

@$ethnic = htmlspecialchars($_POST['apply-ethnic']);

@$predictedgrades = htmlspecialchars($_POST['apply-predictedgrades']);
@$coursechoice = htmlspecialchars($_POST['apply-coursechoice']);
@$asa2 = htmlspecialchars($_POST['apply-asa2']);
@$voc = htmlspecialchars($_POST['apply-voc']);
@$nocourse = htmlspecialchars($_POST['apply-nocourse']);
@$career = htmlspecialchars($_POST['apply-career']);
@$other = htmlspecialchars($_POST['apply-other']);



//Sending Email to form owner
# Email to Owner 
$pfw_header = "From: $email";
$pfw_subject = "Application Form";
$pfw_email_to = "[email protected]";
$pfw_message = "Surname: $surname\n"
. "First Name: $firstname\n"
. "Previous Name: $previousnames\n"
. "Age at 1st Sept: $age1stsept\n"
. "Date of Birth: $dob\n"
. "Home Address: $address\n"
. "Postcode: $postcode\n"
. "Home Telephone: $hometel\n"
. "Mobile no: $mobile\n"
. "Email address: $email\n"
. "Gender: $gender\n"
. "ULN: $uln\n"
. "Nationality: $nationality\n"
. "Lived outside EEA: $outsideeea\n"
. "Dates lived outside EEA: $outsideeeadates\n"
. "Secondary school: $secondaryschools\n"
. "Medical issues: $medical\n"
. "SEN: $SEN\n"
. "Ethnic: $ethnic\n"
. "Predicted Grades: $predictedgrades\n"
. "Course choice: $coursechoice\n"
. "AS/A2 choice: $asa2\n"
. "Vocational choice: $voc\n"
. "No course choice: $postcode\n"
. "Career: $career\n"
. "Other info: $other\n"
;
@mail($pfw_email_to, $pfw_subject ,$pfw_message ,$pfw_header ) ;

echo('<li class="message-success">Your Application form has been received</li>');   

?>

JavaScript:

// Application form submit
$("#apply-submit").click(function () {
    $('form[name=application]').submit();
    $("#application").find('.loader').fadeIn();
});

$('form[name=application]').submit(function () {
    wcFormAction = $("#application").attr('action');
    $.post(wcFormAction, $('form[name=application]').serialize(), function (data) {
        $("#application").find('.loader').fadeOut();
    });
    return false;
});

Edit: I didn't create the original code, i'm just experimenting with this code as a template for a form. I've not had to look at submitting forms before, sorry if my question is off the mark slightly, if I can provide any more information please ask!

You are not getting any errormessages since you have blocked errors for about half of the code... — aksu, Dec 10 '13 at 15:23
You haven't provided the error, I suspect that's becuase you've used error supression on every single line of PHP. Remove the @(s) and you will probably get a useful error message. — piddl0r, Dec 10 '13 at 15:24
are you working on a different server from where you copied the original code? — robbmj, Dec 10 '13 at 15:25

CeritT · Answer 1 · 2013-12-10 15:38:48Z

up vote 0 down vote

PHP code seems alright even with those unneccessary @'s. And Javascript code you are using should work just fine, tried and worked on jsfiddle.

You must address what causing the problem, to do this, write down every step and tool you are using and check them, even the most basic ones. Like;

Are you sure,

you are including jQuery properly?
your ajax request is handled properly? (check if you are getting any responses)

and so on...

answered Dec 10 '13 at 15:38

CeritT
363

Thanks for the reply. I can't see any reference to including my .js file in the original form I copied from, would I be wrong in assuming I don't need to declare it? I'm using Wordpress, which I thought handled all the script libraries in it's includes? Regarding #2, the email address is not receiving emails from the form. – user3087351 Dec 10 '13 at 15:57

add a comment |

asked	11 months ago
viewed	100 times
active	6 months ago

current community

your communities

more stack exchange communities

PHP form with javascript button - not working

1 Answer 1

Your Answer

Not the answer you're looking for? Browse other questions tagged javascript php html forms or ask your own question.

Hot Network Questions

current community

your communities

more stack exchange communities

PHP form with javascript button - not working

1 Answer 1

Your Answer

Sign up or log in

Post as a guest

Not the answer you're looking for? Browse other questions tagged javascript php html forms or ask your own question.

Related

Hot Network Questions