Failure receiving POST results in PHP/HTML - php

Question

I've done tests and it's definitely not a problem with the database, it connects fine and variables input if specified, (the integers work). Note that the {} brackets around the variables in the sql statement, for some reason need to be there for it to work, if someone could tell me why that'd be great.
The main problem is the POST for receiving from the form, nothing echoes, nor inputs to the database. Can anyone help? Thanks in advance.
PHP:
$firstName = $_POST['firstName'];
$lastName = $_POST['lastName'];
$username = $_POST['username'];
$pw = $_POST['pw'];
$email = $_POST['email'];
$wins = 0;
$losses = 0;
$played = 0;
$earnings = 0;
$sql = "
INSERT INTO users (first_name, last_name, username, password, email, last_login, date_joined, wins, losses, played, earnings) VALUES
('{$firstName}','{$lastName}','{$username}','{$pw}','{$email}','1111','2222','{$wins}','{$losses}','{$played}','{$earnings}')
";
if(!mysql_query($sql, $con)){
echo 'Worked';
} else {echo 'Failed';}
HTML:
<form id="registration_form" action="http://valhq.com/register/" method="POST">
<div class="signup_form_content_names">
<div class="signup_form_input_fn">
<input type="text" class="signup_input_style_fn" id="firstName" placeholder="First Name" maxlength="20">
</div>
<div class="signup_form_input_ln">
<input type="text" class="signup_input_style_ln" id="lastName" placeholder="Last Name" maxlength="20">
</div>
</div>
<div class="signup_form_content">
<div class="signup_form_input">
<input type="text" class="signup_input_style" placeholder="E-Mail" id="email" maxlength="40">
</div>
<div class="signup_form_input">
<input type="text" class="signup_input_style" placeholder="Confirm E-Mail" id="emailconf" maxlength="40">
</div>
<div class="signup_form_input">
<input type="text" class="signup_input_style" placeholder="Desired Username" id="username" maxlength="20">
</div>
<div class="signup_form_input">
<input type="password" class="signup_input_style" placeholder="Password" id="pw" maxlength="64">
</div>
<div class="signup_form_input">
<input type="password" class="signup_input_style" placeholder="Confirm Password" id="pwconf" maxlength="64">
</div>
<div class="signup_tc">
<p>
<input type="checkbox" id="terms" value="terms_true" style="vertical-align:middle;">
I agree to the Terms and Conditions
<span class="signup_tc_required">*</span>
</p>
</div>
<input type="submit" id="submit" class="signup_submit" value="Create Account">
<div class="signup_alreadyMember">
Already a member? Login.
</div>
<div class="signup_error">
<span class="signup_error" id="fn_error_message"></span>
<span class="signup_error" id="ln_error_message"></span>
<span class="signup_error" id="email_error_message"></span>
<span class="signup_error" id="emailconf_error_message"></span>
<span class="signup_error" id="username_error_message"></span>
<span class="signup_error" id="pw_error_message"></span>
<span class="signup_error" id="pwconf_error_message"></span>
<span class="signup_error" id="tos_error_message"></span>
</div>
</div>
</form>

Answer 1

if you want to get your values using $_POST your inputs name attributes must be set
example add name="firstName"
<input type="text" class="signup_input_style_fn" name="firstName" id="firstName" placeholder="First Name" maxlength="20">
So now you can access it using
$firstName = $_POST['firstName'];

Answer 2

Change your "Id" to "name",and you will succeed.

Answer 3

You are missing name attribute from input , if you are not using ajax then you require name attribute
Use This
<form id="registration_form" action="http://valhq.com/register/" method="POST">
<div class="signup_form_content_names">
<div class="signup_form_input_fn">
<input type="text" class="signup_input_style_fn" id="firstName" name="firstName" placeholder="First Name" maxlength="20">
</div>
<div class="signup_form_input_ln">
<input type="text" class="signup_input_style_ln" id="lastName" name="lastName" placeholder="Last Name" maxlength="20">
</div>
</div>
<div class="signup_form_content">
<div class="signup_form_input">
<input type="text" class="signup_input_style" placeholder="E-Mail" id="email" name="email" maxlength="40">
</div>
<div class="signup_form_input">
<input type="text" class="signup_input_style" placeholder="Confirm E-Mail" id="emailconf" name="emailconf" maxlength="40">
</div>
<div class="signup_form_input">
<input type="text" class="signup_input_style" placeholder="Desired Username" id="username" name="username" maxlength="20">
</div>
<div class="signup_form_input">
<input type="password" class="signup_input_style" placeholder="Password" id="pw" name="pw" maxlength="64">
</div>
<div class="signup_form_input">
<input type="password" class="signup_input_style" placeholder="Confirm Password" id="pwconf" name="pwconf" maxlength="64">
</div>
<div class="signup_tc">
<p>
<input type="checkbox" id="terms" name="terms" value="terms_true" style="vertical-align:middle;">
I agree to the Terms and Conditions
<span class="signup_tc_required">*</span>
</p>
</div>
<input type="submit" id="submit" name="submit" class="signup_submit" value="Create Account">
<div class="signup_alreadyMember">
Already a member? Login.
</div>
<div class="signup_error">
<span class="signup_error" id="fn_error_message"></span>
<span class="signup_error" id="ln_error_message"></span>
<span class="signup_error" id="email_error_message"></span>
<span class="signup_error" id="emailconf_error_message"></span>
<span class="signup_error" id="username_error_message"></span>
<span class="signup_error" id="pw_error_message"></span>
<span class="signup_error" id="pwconf_error_message"></span>
<span class="signup_error" id="tos_error_message"></span>
</div>
</div>
</form>

Answer 4

Can you try echoing the variables in your php file to check if the variables are being set to the correct values from the form.
for example
echo "first name: $firstName";
echo "email: $email";
And I would also advise if you can try directly putting the actual php file in the action of your form. Just like below:
<form id="registration_form" action="<your php file here>" method="POST">