HTML form POST not sending values - php

Question

I know that there has been a couple of threads like that, I have looked through them and I can't seem to be able to find an answer. So I have a HTML form with a PHP file action and method POST. Here is the form:
<div class="col-md-4 col-sm-12">
<div class="contact-form bottom">
<h2>Send a message</h2>
<form id="main-contact-form" name="contact-form" method="POST" action='http://creobox.ie/site/sendemail.php'>
<div class="form-group">
<input type="text" name="name" class="form-control" required="required" placeholder="Name">
</div>
<div class="form-group">
<input type="email" name="email" class="form-control" required="required" placeholder="Email Id">
</div>
<div class="form-group">
<textarea name="message" id="message" required="required" class="form-control" rows="8" placeholder="Your text here"></textarea>
</div>
<div class="form-group">
<input type="submit" name="submit" class="btn btn-submit" value="Submit">
</div>
</form>
</div>
</div>
Please note, I tried using action ="sendemail.php" with no effect.
Then I am trying to GET the data in the PHP file, like so:
$name = #trim(stripslashes($_POST['name']));
$from = #trim(stripslashes($_POST['email']));
$subject = #trim(stripslashes($_POST['subject']));
$message = #trim(stripslashes($_POST['message']));
The rest of the code is just composing the e-mail etc - this part works fine.
Am I missing something very simple? The code looks to be fine! I did echo on $name, $from, $subject and $message and all I got was
Details : <br/>
No errors showing up or anything... Thanks for any help!
Ok, so I tried to go with the AJAX... I modified my form to be
<div class="contact-form bottom">
<h2>Send a message</h2>
<form id="main-contact-form" name="contact-form">
<div class="form-group">
<input type="text" name="name" class="form-control" required="required" placeholder="Name">
</div>
<div class="form-group">
<input type="email" name="email" class="form-control" required="required" placeholder="Email Id">
</div>
<div class="form-group">
<textarea name="message" id="message" required="required" class="form-control" rows="8" placeholder="Your text here"></textarea>
</div>
<div class="form-group">
<input type="submit" name="submit" class="btn btn-submit" value="Submit" href="javascript: void(0);" onclick = "sendMail();">
</div>
</form>
</div>
and created a js function
function sendMail()
{
var name = document.getElementById('name');
var email = document.getElementById('email');
var message = document.getElementById('message');
$.ajax({
type: 'POST',
url: 'sendemail.php',
data: {
'name' : name,
'email' : email,
'message' : message
},
success: function(json) {
if (json.status == 'S')
alert('Duplicates removed!');
},
error: function() {}
});
}
But that doesn't work either... I just get a 304 - Not Modified error with a cached index page. This is starting to burn my brain! Could I be using an old version of jquery, hence all the problems?!