Does anyone have an idea of why my HTML form does not submit anything? Once I click the submit button it does nothing? No idea what is going on, have checked everything and can't get my head around it? If anyone might have an idea, it would be really helpful, thanks!
<div class="row">
<div class="col-md-6">
<div class="alert alert-success hidden" id="contactSuccess">
<strong>Success!</strong> Your message has been sent to us.
</div>
<div class="alert alert-danger hidden" id="contactError">
<strong>Error!</strong> There was an error sending your message.
</div>
<form name="register" action="register.php" id="contactForm" type="POST">
<div class="row">
<div class="form-group">
<div class="col-md-6">
<label>First name *</label>
<input type="text" value="" data-msg-required="Please enter your first name." maxlength="100" class="form-control" name="first_name" id="name">
</div>
<div class="col-md-6">
<label>Last name *</label>
<input type="text" value="" data-msg-required="Please enter your last name." maxlength="100" class="form-control" name="last_name" id="name">
</div>
</div>
</div>
<div class="row">
<div class="form-group">
<div class="col-md-12">
<label>Your email address *</label>
<input type="email" value="" data-msg-required="Please enter your email address." data-msg-email="Please enter a valid email address." maxlength="100" class="form-control" name="email_address" id="email">
</div>
</div>
</div>
<div class="row">
<div class="form-group">
<div class="col-md-6">
<label>Username *</label>
<input type="text" value="" data-msg-required="Please enter a valid username." maxlength="100" class="form-control" name="username" id="name">
</div>
<div class="col-md-6">
<label>Contact Number *</label>
<input type="number" value="" data-msg-required="Please enter your mobile number." maxlength="100" class="form-control" name="mobile" id="name">
</div>
</div>
</div>
<div class="row">
<div class="form-group">
<div class="col-md-6">
<label>Date of birth *</label>
<br>
<fieldset class="date">
<select id="date1" name="date1" />
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
<option>14</option>
<option>15</option>
<option>16</option>
<option>17</option>
<option>18</option>
<option>19</option>
<option>20</option>
<option>21</option>
<option>22</option>
<option>23</option>
<option>24</option>
<option>25</option>
<option>26</option>
<option>27</option>
<option>28</option>
<option>29</option>
<option>30</option>
<option>31</option>
</select>
<select id="date2" name="date2" />
<option>Jan</option>
<option>Feb</option>
<option>Mar</option>
<option>Apr</option>
<option>May</option>
<option>Jun</option>
<option>Jul</option>
<option>Aug</option>
<option>Sep</option>
<option>Oct</option>
<option>Nov</option>
<option>Dec</option>
</select>
<select id="date3" name="date3" />
<option>1905</option>
<option>1906</option>
<option>1907</option>
<option>1908</option>
<option>1909</option>
<option>1910</option>
<option>1911</option>
<option>1912</option>
<option>1913</option>
<option>1914</option>
<option>1915</option>
<option>1916</option>
<option>1917</option>
<option>1918</option>
<option>1919</option>
<option>1920</option>
<option>1921</option>
<option>1922</option>
<option>1923</option>
<option>1924</option>
<option>1925</option>
<option>1926</option>
<option>1927</option>
<option>1928</option>
<option>1929</option>
<option>1930</option>
<option>1931</option>
<option>1932</option>
<option>1933</option>
<option>1934</option>
<option>1935</option>
<option>1936</option>
<option>1937</option>
<option>1938</option>
<option>1939</option>
<option>1940</option>
<option>1941</option>
<option>1942</option>
<option>1943</option>
<option>1944</option>
<option>1945</option>
<option>1946</option>
<option>1947</option>
<option>1948</option>
<option>1949</option>
<option>1950</option>
<option>1951</option>
<option>1952</option>
<option>1953</option>
<option>1954</option>
<option>1955</option>
<option>1956</option>
<option>1957</option>
<option>1958</option>
<option>1959</option>
<option>1960</option>
<option>1961</option>
<option>1962</option>
<option>1963</option>
<option>1964</option>
<option>1965</option>
<option>1966</option>
<option>1967</option>
<option>1968</option>
<option>1969</option>
<option>1970</option>
<option>1971</option>
<option>1972</option>
<option>1973</option>
<option>1974</option>
<option>1975</option>
<option>1976</option>
<option>1977</option>
<option>1978</option>
<option>1979</option>
<option>1980</option>
<option>1981</option>
<option>1982</option>
<option>1983</option>
<option>1984</option>
<option>1985</option>
<option>1986</option>
<option>1987</option>
<option>1988</option>
<option>1989</option>
<option>1990</option>
<option>1991</option>
<option>1992</option>
<option>1993</option>
<option>1994</option>
<option>1995</option>
<option>1996</option>
<option>1997</option>
<option>1998</option>
<option>1999</option>
<option>2000</option>
<option>2001</option>
<option>2002</option>
<option>2003</option>
<option>2004</option>
<option>2005</option>
<option>2006</option>
<option>2007</option>
<option>2008</option>
<option>2009</option>
<option>2010</option>
<option>2011</option>
<option>2012</option>
<option>2013</option>
<option>2014</option>
</select>
</fieldset>
</div>
<div class="col-md-6">
<label>Contact Number *</label>
<input type="radio" name="gender" value="Male">Male
<input type="radio" name="gender" value="Female">Female
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<input type="submit" name="Submit" value="Register" class="btn btn-lg btn-primary">
</div>
</div>
</form>
</div>
I am using a copy of the contact form on my site for the registration form as it looks so much better, maybe this is one of the reasons ?
Register.php as requested:
<?
include 'core/init.php';
// Define post fields into simple variables
$first_name = mysql_real_escape_string($_POST['first_name']);
$last_name = mysql_real_escape_string($_POST['last_name']);
$email_address = mysql_real_escape_string($_POST['email_address']);
$username = mysql_real_escape_string($_POST['username']);
$mobile = $_POST['mobile'];
$gender = $_POST['gender'];
$date1 = $_POST['date1'];
$date2 = $_POST['date2'];
$date3 = $_POST['date3'];
/* Let's strip some slashes in case the user entered
any escaped characters. */
$first_name = stripslashes($first_name);
$last_name = stripslashes($last_name);
$email_address = stripslashes($email_address);
$username = stripslashes($username);
$gender = stripslashes($gender);
/* Do some error checking on the form posted fields */
if((!$first_name) || (!$last_name) || (!$email_address) || (!$gender) || (!$username)){
if(!$first_name){
header('Location: signup.php?signuperror=2');
}
if(!$last_name){
header('Location: signup.php?signuperror=3');
}
if(!$email_address){
header('Location: signup.php?signuperror=4');
}
if(!$username){
header('Location: signup.php?signuperror=5');
}
if(!$gender){
header('Location: signup.php?signuperror=6');
}
include "signup.php"; // Show the form again!
/* End the error checking and if everything is ok, we'll move on to
creating the user account */
exit(); // if the error checking has failed, we'll exit the script!
}
/* Let's do some checking and ensure that the user's email address or username
does not exist in the database */
$sql_email_check = mysql_query("SELECT email_address FROM users WHERE email_address='$email_address'");
$sql_username_check = mysql_query("SELECT username FROM users WHERE username='$username'");
$email_check = mysql_num_rows($sql_email_check);
$username_check = mysql_num_rows($sql_username_check);
if(($email_check > 0) || ($username_check > 0)){
if($email_check > 0){
header('Location: signup.php?signuperror=7');
unset($email_address);
}
if($username_check > 0){
header('Location: signup.php?signuperror=8');
unset($username);
}
include 'signup.php'; // Show the form again!
exit(); // exit the script so that we do not create this account!
}
/* Everything has passed both error checks that we have done.
It's time to create the account! */
/* Random Password generator.
http://www.phpfreaks.com/quickcode/Random_Password_Generator/56.php
We'll generate a random password for the
user and encrypt it, email it and then enter it into the db.
*/
function makeRandomPassword() {
$salt = "abchefghjkmnpqrstuvwxyz0123456789";
srand((double)microtime()*1000000);
$i = 0;
while ($i <= 7) {
$num = rand() % 33;
$tmp = substr($salt, $num, 1);
$pass = $pass . $tmp;
$i++;
}
return $pass;
}
$random_password = makeRandomPassword();
$db_password = md5($random_password);
// Enter info into the Database.
$info2 = htmlspecialchars($info);
$sql = mysql_query("INSERT INTO users (first_name, last_name, email_address, username, password, gender, date1, date2, date3, signup_date, mobile)
VALUES('$first_name', '$last_name', '$email_address', '$username', '$db_password', '$gender', '$date1', '$date2', '$date3', now(), '$mobile')") or die (mysql_error());
if(!$sql){
header('Location: signup.php?signuperror=9');
} else {
$userid = mysql_insert_id();
// Let's mail the user!
$subject = "BaseCentre Members";
$message = "Dear $first_name $last_name,
Thank you for registering at BaseCentre, http://www.basecentre.co.uk/
You are two steps away from logging in and accessing our exclusive entertainment.
To activate your membership, please click here: http://www.basecentre.co.uk/activate.php?id=$userid&code=$db_password
Once you activate your memebership, you will be able to login with the following information:
Username: $username
Password: $random_password
Thanks!
Base Admin Team.
This is an automated response, please do not reply!";
mail($email_address, $subject, $message, "From: BaseCentre Members<admin@basecentre.co.uk>\nX-Mailer: PHP/" . phpversion());
////// MAIL ADMIN
$subject2 = "BaseCentre New User!";
$message2 = "Dear Admin,
This is a message to alert you that a new user has signed up to BaseCentre.
You can view all details of the new member and all other members direct from the admin control panel at http://basecentre.co.uk/admin.php
Here are the details of the new registered user:
Username: $username
Email Address: $email_address
Thanks!
BaseCentre Automation.
This is an automated response, please do not reply!";
mail('aidan6141@hotmail.co.uk', $subject2, $message2, "From: BaseCentre Members<admin@basecentre.co.uk>\nX-Mailer: PHP/" . phpversion());
header('Location: login.php?loginerror=6');
include 'login.php';
}
?>
JS Script for reference:
/*
Name: View - Contact
Written by: Okler Themes - (http://www.okler.net)
Version: 2.0
*/
(function() {
"use strict";
var Contact = {
initialized: false,
initialize: function() {
if (this.initialized) return;
this.initialized = true;
this.build();
this.events();
},
build: function() {
this.validations();
},
events: function() {
},
validations: function() {
$("#contactForm").validate({
submitHandler: function(form) {
// Loading State
var submitButton = $(this.submitButton);
submitButton.button("loading");
// Ajax Submit
$.ajax({
type: "POST",
url: "php/contact-form.php",
data: {
"name": $("#contactForm #name").val(),
"email": $("#contactForm #email").val(),
"subject": $("#contactForm #subject").val(),
"message": $("#contactForm #message").val()
},
dataType: "json",
success: function (data) {
if (data.response == "success") {
$("#contactSuccess").removeClass("hidden");
$("#contactError").addClass("hidden");
// Reset Form
$("#contactForm .form-control")
.val("")
.blur()
.parent()
.removeClass("has-success")
.removeClass("has-error")
.find("label.error")
.remove();
if(($("#contactSuccess").position().top - 80) < $(window).scrollTop()){
$("html, body").animate({
scrollTop: $("#contactSuccess").offset().top - 80
}, 300);
}
} else {
$("#contactError").removeClass("hidden");
$("#contactSuccess").addClass("hidden");
if(($("#contactError").position().top - 80) < $(window).scrollTop()){
$("html, body").animate({
scrollTop: $("#contactError").offset().top - 80
}, 300);
}
}
},
complete: function () {
submitButton.button("reset");
}
});
},
rules: {
name: {
required: true
},
email: {
required: true,
email: true
},
subject: {
required: true
},
message: {
required: true
}
},
highlight: function (element) {
$(element)
.parent()
.removeClass("has-success")
.addClass("has-error");
},
success: function (element) {
$(element)
.parent()
.removeClass("has-error")
.addClass("has-success")
.find("label.error")
.remove();
}
});
}
};
Contact.initialize();
})();
Make sure you submit button is of type submit rather than type button.
The valid attribute for the form is
method
nottype
method = 'post'
Change this line,
you must use
method="POST"
instead oftype="POST"
If your form is not submitting and you have checked the suggestions in the previous answers then its probably that you have multiple form ending tags, overlapping form tags or incorrectly closed divs.
Here's a checklist for you which are standard and not php purely based, something you could have a look at in case you still experience this issue:
Check you have a valid action element in your form tag eg:
action="/subjects"
Check you have a valid method element (not a type element) eg:
method="post"
Opening and closing
<form>
tags and a submit button placed within these tags. Make sure that there are no extra divs causing incorrect closing of elements. - DOUBLE CHECK THIS AS IT IS THE MOST COMMON CAUSE OF MANY HEADACHESOverlapping Form tags. (Make sure that you don't have multiple form closing tags, etc)
post is being sent but there is an error in the backend/server/api which is not returning an error or success message to the browser? (Check Network section or browser after pressing
F12
)If your problem still happens then consider trying to use javascript instead of html form submission for instance. By adding an
onclick
event to a button and writing the form.submit function.I've never heard of any different form submit errors which are not logged in the console or which you can see in the Network section of your browsers development toolbar. Curious to know of your problem in the end.
As well as the post method, input fields should also have a name attribute.
is simple :
type="POST"
change withMethod="POST"