I've read several forums according to this subject and none of the things I've tried worked.
My problem is the post from AJAX in JavaScript to a PHP page it doesn't work when I make and echo of the variable its empty don't know why. What I'm trying to do is this: I have an API that sends me a JSON. I build an HTML code with that code, and everything is working with that. I'm building this table:
When I hit the delete button it shows this:
And the result is that I get redirected to the page anularfunc.php
HTML code of main page:
<?php
//Habilitar las sesiones
$codigoError ="";
session_start();
//Validar si existen las sesiones
if(!isset($_SESSION['vsJsonAgencias']))
{
header("location:../index.php");
}
if(!empty($_SESSION['codigoError'])){
$codigoError = $_SESSION['codigoError'];
}
?>
<!DOCTYPE html>
<link href="../css/tabla.css" rel="stylesheet">
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="SGLabz">
<title>CitasWeb</title>
<!-- Bootstrap core CSS -->
<link href="../vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="../css/portfolio-item.css" rel="stylesheet">
<link rel="stylesheet" href="../css/form-basic.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="../js/form.js"></script>
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top">
<div class="container">
<a class="navbar-brand" href="#">CitasWeb</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
</div>
</nav>
<!-- Page Content -->
<div class="container">
<!-- Portfolio Item Row -->
<form class="form-basic" id="form-basic" action="http://localhost/citasweb/php/menu.php" method="post">
<div class="form-title-row">
<h1>Citas Programadas</h1>
</div>
<div class="form-row">
<table id="table_tingkat_jual">
<thead>
<tr>
<th>No. CITA</th>
<th>AGENCIA</th>
<th>GESTION</th>
<th>FECHA</th>
<th>GESTOR</th>
<th>HORA</th>
<th></th>
</tr>
</thead>
<tbody>
<?php
$jsonData =$_SESSION['jsonHistorial'];
$jsonDataObject = json_decode($jsonData);
foreach($jsonDataObject->Citas as $option)
{
echo '<tr >';
echo '<td id="'. $option->NoCita . '">'. $option->NoCita . '</td>';
echo '<td>'. $option->Agencia . '</td>';
echo '<td>'. $option->Gestion . '</td>';
echo '<td>'. $option->Fecha . '</td>';
echo '<td>'. $option->Gestor . '</td>';
echo '<td>'. $option->hora . '</td>';
echo '<td><a type="submit" onclick="confirmar();" ><IMG SRC="delete.png" ALT="ELIMINAR" WIDTH=40 HEIGHT=40/></a></td>';
echo '</tr>';
}
?>
</tbody>
</table>
</div>
<div class="form-row">
<button type="submit" >Aceptar</button>
</div>
</form>
</div>
<!-- /.row -->
</div>
<!-- /.container -->
<!-- Footer -->
<footer class="py-5 bg-dark">
<div class="container">
<p class="m-0 text-center text-white">Copyright © Citas Web 2017</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/popper/popper.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript">
function confirmar(){
var mensaje = confirm('¿Está seguro de anular esta cita?');
if (mensaje) {
$('#table_tingkat_jual tr').click(function(e) {
e.stopPropagation();
var $this = $(this);
var tdid = $this.find('td[id]').attr('id');
var json_str = tdid;
$(function(){
$.ajax({
type: "POST",
dataType: "json",
url: "anularfunc.php",
data: { "name" : json_str },
success: function (data) { alert(data) },
eror: function (data) { alert(data) }
});
});
//alert("TD ID " + tdid);
});
window.location.href="http://localhost/citasweb/anularfunc.php";
}
else{
window.location.href="http://localhost/citasweb/php/historialCita.php";
}
}
</script>
</body>
</html>
JavaScript:
<script type="text/javascript">
function confirmar(){
var mensaje = confirm('¿Está seguro de anular esta cita?');
if (mensaje) {
$('#table_tingkat_jual tr').click(function(e) {
e.stopPropagation();
var $this = $(this);
var tdid = $this.find('td[id]').attr('id');
var json_str = tdid;
$(function(){
$.ajax({
type: "POST",
dataType: "json",
url: "anularfunc.php",
data: { "name" : json_str },
success: function (data) { alert(data) },
eror: function (data) { alert(data) }
});
});
//alert("TD ID " + tdid);
});
window.location.href="http://localhost/citasweb/anularfunc.php";
}
else{
window.location.href="http://localhost/citasweb/php/historialCita.php";
}
}
</script>
And the final PHP files that receives the post is this:
<?php
session_start(); // start up your PHP session!
$fields_string="";
$jsonAgencias = $_SESSION['vsJsonAgencias'];
echo "HELLO";
$postData = $_POST['name'];
echo $postData;
print_r($postData);
?>
I placed an echo hello just to make sure it's showing something, but I don't know how to make it work.
