Html form not submitting data?
Asked Answered
M

8

5

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>…</option>
                        </select>
                        <select id="date2" name="date2" />
                        <option>Jan</option>
                        <option>Feb</option>
                        <option>Mar</option>
                        </select>
                        <select id="date3" name="date3" />
                        <option>1905</option>
                        <option>1906</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<[email protected]>\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('[email protected]', $subject2, $message2, "From: BaseCentre Members<[email protected]>\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();

})();
Marcellusmarcelo answered 31/3, 2014 at 12:39 Comment(16)
can you post your register.php as well?Byandby
You should learn how to use the label element properly. Without a for attribute or a form control inside it, a label is useless.Humphries
I will add the register script now...Marcellusmarcelo
Another problem your select elements <select id="date3" name="date3" /> should be <select id="date3" name="date3" > (no / before > )Ciliate
Purpose of form is to submit data somwhere. If we can't see where do you post it how can we help you?Susuable
Just added the register.phpMarcellusmarcelo
try var_dump($_POST) as see what's the outputByandby
@jeff Although it's unnecessary, it won't result in any error.Chadwell
I can't even var_dump($_POST) as the form isn't actually submitting at all??Marcellusmarcelo
i tried the code and it's working like a charm. Is it possible you have any JS issue?Byandby
Could this be something to do with the js script for the form? <script src="js/views/view.contact.js"></script>Marcellusmarcelo
sure, try to comment or temporarily remove <script src="js/views/view.contact.js"></script> and see what happensByandby
Removing the JS script works and displays the data using the Var_Dump correctly! So it must be something with the JS Script that I am using for both the contact form and now the register form?Marcellusmarcelo
it seems you have to debug it a little bit to see where's the issue :DByandby
I'm literally know nothing about JS scripts haha! Need to learn a bit I think, could it be the URL link that might be affecting it? But shouldn't it still direct and post anyway?Marcellusmarcelo
You really should not use javascript to validate data. Data should "always" be validated server side. The client could turn off / block Javascript in his browser and all your validations are useless and bad / harmful data could be entered.Residentiary
G
19

As well as the post method, input fields should also have a name attribute.

Gymno answered 11/1, 2015 at 2:46 Comment(2)
This was the reason that my node express application was not getting it. Thank you!Piderit
This answer saved me! I had id field but not name field, and the server side received no data since name was missing. There was no error/warning on console.Ryannryazan
R
9

Change this line,

<form name="register" action="register.php" id="contactForm" method="POST">

you must use method="POST" instead of type="POST"

Ralphralston answered 31/3, 2014 at 12:41 Comment(8)
Changed it yet its still not posting anything?Marcellusmarcelo
When you type type="POST", its submitting as default method "GET". And when type as method ="POST" then its posting as POST data. Its working fine for me. Please check there may some other jquery or JS issue. Please check your console for viewing errors.Ralphralston
Hmmm does the form actually submit?Marcellusmarcelo
Yes the form is getting submitted.. And i am getting the values in the new php file.Ralphralston
Or else please check whether the action="register.php" is located in correct path. the path of your contact form and register.php should be in same folder according to your code.Ralphralston
Yes @ponciste. I have copied AidanPT's code. Its working for me when i changed the method="POST". I mean the form is submitting in my end. I think some JS is making the thing not workingRalphralston
Just added the JS code, not sure what is actually wrong with it? I am not very good with JS scripting however I am using the same code for both the register form and the contact form?Marcellusmarcelo
When I remove the JS script, the form works fine for me?Marcellusmarcelo
L
6

If your form is not submitting and you have checked the suggestions in the previous answers then its likely that you have multiple form ending tags, overlapping form tags or some incorrectly closed div elements.

Here's a checklist, additional things you could have a look at in case you still experience the problem:

  1. Check you have a valid 'action' attribute your form tag eg: action="/subjects"

  2. Check you have a valid 'method' attribute (not a 'type' attribute) eg: method="post"

  3. Opening and closing <form> tags and a submit button placed within these tags. Make sure that there are no incorrectly closed div elements. - DOUBLE CHECK THIS AS IT IS THE MOST COMMON CAUSE OF MANY HEADACHES

  4. Overlapping Form tags. (Make sure that you don't have multiple form closing tags, etc)

  5. 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 of browser in Developer Tools (windows shortcut: F12)

If your problem still happens then consider trying to use javascript instead of html form submission. By adding an onclick event to a button and writing the form.submit function. This way you can debug the entire thing :)

Curious to know of your problem in the end.

Lucey answered 19/1, 2016 at 11:16 Comment(1)
btw, a mix of a form inputs + modal ( with its own button submit ) also conflicted in my case ... removing the modal element via developer tools and the regular form button worked ...Strung
P
6

Make sure you submit button is of type submit rather than type button.

Pachston answered 31/5, 2018 at 0:53 Comment(0)
I
2

The valid attribute for the form is method not type

method = 'post'

Immix answered 31/3, 2014 at 12:41 Comment(1)
Changed it but it's still not posting?Marcellusmarcelo
E
2

Make sure that you have the attribute name on each field.

Example: name="email"

Earthenware answered 24/3, 2021 at 20:18 Comment(0)
G
0

is simple : type="POST" change with Method="POST"

Gatias answered 4/7, 2014 at 20:44 Comment(0)
S
-2

Also check that your action="register.php" is not being redirected.

For example action="/xyz/register.php" -- register.php should be in the 'xyz' folder.

If register.php is not in the 'xyz' folder and the form is being redirected, it will go to the correct page but lose the form's values (name, email etc).

Salisbury answered 12/4, 2017 at 4:42 Comment(0)

© 2022 - 2024 — McMap. All rights reserved.