I have a form with radio buttons and checkboxes and want to retrieve which of them are checked. The form is submitted using jQuery and the information is stored in two variables (targets and diffs). These variables are then posted using $.ajax().
My problem: Firebug tells me that they have been posted, still I can't seem to retrieve them using $_POST. Actually, $_POST returns old data. I tried unset($_POST) and deleting my browser cache, nothing worked. What can I do?
Thank you so much for your help!
submit.js:
$(document).ready(function () {
alert('start');
$('#right').on('submit', 'form', function(event) {
var checkboxes = new Array();
$('input[name=target]:checked').each(function(){
checkboxes.push($(this).val());
});
var radio = $('input[name=diff]:radio:checked').val();
$.ajax({
url: 'index.php',
type: 'post',
data: {'targets': checkboxes, 'diffs': radio},
success: function() {
alert("success"); }
});
return false;
});
});
index.php:
<!DOCTYPE html>
<html lang="en-US">
<head>
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script src="js/submit.js"></script>
</head>
<body>
<?php
if(isset($_POST['targets'])){
$targets = $_POST['targets'];
echo "targets set";
}
if(isset($_POST['diffs'])){
$diffs = $_POST['diffs'];
echo "diffs set";
}
?>
<div id="right">
<div class="content">
<form method="POST" action="<?php echo $_SERVER['PHP_SELF']; ?>">
<input type="checkbox" name="target" value="Check1">Check1
<input type="checkbox" name="target" value="Check2">Check2
<input type="checkbox" name="target" value="Check3">Check3
<input type="radio" name="diff" value="Radio1">Radio1
<input type="radio" name="diff" value="Radio2">Radio2
</form>
</div>
</div>
</body>
</html>