JQuery ajax serialized input text field is empty on server side

Question

I have a couple of radio fields and an input text type field on my form:

<input name="cbPerson" type="radio" value="1" checked/>Person1
<input name="cbPerson" type="radio" value="2"/>Person2
<input name="txtName" type="text" />

I am serializing my form this way:

$.ajax({
            type: 'post',           
            url: 'form-1-proc.php', 
            data: $('form').serialize(),
            success: function (data) {              
                 alert(data);
            },
            error: function () {
                alert('error');                 
            }
    });

And I am getting the data on server side ( form-1-proc.php ) this way:

$person = $_POST['cbPerson'];
$name = $_POST['txtName'];

The variable $person has an expected value, but the variable $name never brings a value and it is always "0".

This page is worked as a separate page on Joomla driven website btw, the page itself is on the root of the site so doesn't mess up with Joomla routing and stuff.

Can you please tell me how can I get the data from the input text fields?. Both have a name attribute and on the client it holds a value if i output the value of serialize function thru console or an alert with javascript.

Thank you.

Answer 1

I am not able to replicate the issue.

test.php

<?php

if (count($_POST))
{
    $person = $_POST['cbPerson'];
    $name = $_POST['txtName'];
    exit("Person = $person | Name = $name");
}

?>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript">

function test()
{
    $.ajax({
    type: 'post',           
    url: 'test.php', 
    data: $('form').serialize(),
    success: function (data) {              
        alert(data);
    },
    error: function () {
        alert('error');                 
    }
    });
}

</script>

<form>
<input name="cbPerson" type="radio" value="1" checked/>Person1
<input name="cbPerson" type="radio" value="2"/>Person2
<input name="txtName" type="text" />
<input type="button" onclick="test();" value="Test">
</form>

Answer 2

The problem was when I was trying to get the values on the server side, I was using:

$name = $_POST['txtName'];
echo 'name:' + $name; 
die();

And hence the return value of 0 everytime I tried to get it after. So I changed it to:

$name = $_POST['txtName'];
echo 'name'.$name;
die();

...and got it.

JQuery serializing works well on my isolated php page in this Joomla website.

Thank you for your help.