Good I need to be able to access from the DOM to a button painted with PHP, which is called from an AJAX. Since I read that the DOM would do it to the AJAX and then it gives you undefined , I can not do it the normal way.
The specific button is "Details".
Here I leave the 3 files:
Order.php
public function fecha($fecha)
{
parent::conectar();
$consulta = 'select * from pedidos where fecha_pdo="'.$fecha.'"';
$verificar_fecha = parent::verificarRegistros($consulta);
if($verificar_fecha > 0){
$fecha = parent::query($consulta);
echo'<table id="tablaPedidosFecha" class="table table-striped">
<tbody>
<tr class="superior">
<td>Nº</td>
<td>Fecha</td>
<td>Descuento</td>
<td>Cliente</td>
<td>Estado</td>
<td></td>
</tr>';
while ($fechas = mysqli_fetch_array($fecha)){
echo
"<tr>
<td>".$fechas['numero_pdo']."</td>
<td>".$fechas['fecha_pdo']."</td>
<td>".$fechas['tasa_descuento']."</td>
<td>".$fechas['numero_cli']."</td>
<td>".$fechas['estado_pdo']."</td>
<td>
<a href='../../controller/pedidos/pedidosControllerDetalles.php?id=".$fechas['numero_pdo']."'><button class='modify btn btn-primary'>Detalles</button></a>
<a href='pedidos.php?modificar=".$fechas['numero_pdo']."&fecha=".$fechas['fecha_pdo']."&descuento=".$fechas['tasa_descuento']."&cliente=".$fechas['numero_cli']."&estado=".$fechas['estado_pdo']."'><button class='modify btn btn-primary'>Modificar</button></a>
<a href='../../controller/pedidos/pedidosControllerBorrar.php?id=".$fechas['numero_pdo']."'><button class='modify btn btn-primary'>Borrar</button></a>
</td>
</tr>";
}
echo '</tbody>
</table>';
}else{
echo 'error_2';
}
parent::cerrar();
}
operations-request.js
$('#clickFechaPedido').click(function(){
$('.title').hide();
$('.insertarDatos').css('display', 'none');
$('#tablas').show();
var fecha = $('#inputFechaPedido').val();
$.ajax({
method: 'POST',
url: '../../controller/pedidos/pedidosControllerF.php',
data: {fecha_php: fecha},
beforeSend: function(){
$('#load').show();
},
success: function(res){
$('#load').hide();
if(res == 'error_1'){
swal('Error', 'Debes indicar una fecha', 'error');
}else if(res == 'error_2'){
swal('Error', 'No hay ningún pedido con esa fecha', 'warning');
}else{
$('#tablas').html(res);
}
}
});
});
OrdersControllerF.php
<?php
$fecha = $_POST['fecha_php'];
if(empty($fecha)){
echo 'error_1';
}else{
require_once('../../model/pedido.php');
$pedido = new Pedido();
$pedido -> fecha($fecha);
}
?>
file orders.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>SGAE - Pedidos</title>
<link rel="stylesheet" href="../../css/bootstrap.min.css">
<link rel="stylesheet" href="../../css/font-awesome.min.css">
<link rel="stylesheet" href="../../css/sweetalert.css">
<link rel="stylesheet" href="../../css/style.css">
</head>
<body>
<?php
include('components/menu.php');
?>
<div class="main">
<div id="top" class="row">
<div class="input-group col-xs-3">
<div class="input-group-addon" id="clickFechaPedido">
<i class="fa fa-calendar"></i>
</div>
<input type="date" class="form-control" id="inputFechaPedido" name="fecha">
</div>
<div class="input-group col-xs-2">
<div class="input-group-addon" id="clickNumeroPedido"><i class="fa fa-search"></i></div>
<input type="number" class="form-control" id="inputNumeroPedido" name="npedido" placeholder="Nº pedido">
</div>
<div class="input-group col-xs-2">
<div class="input-group-addon" id="clickEstadoPedido"><i class="fa fa-check-square"></i></div>
<select class="form-control" id="inputEstadoPedido" name="estado">
<option value="vacio" selected>Estado:</option>
<option value="Pendiente">Pendiente</option>
<option value="Aceptado">Aceptado</option>
<option value="Rechazado">Rechazado</option>
</select>
</div>
<button class="nuevos btn btn-primary" id="buttonNuevoPedido">Nuevo Pedido</button>
</div>
<div id="contenido">
<div id="load" hidden="hidden">
<img src="../../img/load.gif">
</div>
<div class="table-responsive" id="tablas">
</div>
<h2 class="title" hidden="hidden">Nuevo Pedido</h2>
<div id="new-pedidos" class="row insertarDatos">
<div class="input-group col-xs-3">
<div class="input-group-addon">
<i class="fa fa-calendar"></i>
</div>
<input type="date" name="nuevaFecha" class="form-control" id="inputNuevaFecha"></input>
</div>
<div class="input-group col-xs-2">
<div class="input-group-addon">
<i class="fa fa-money"></i>
</div>
<input type="number" name="nuevoDescuento" placeholder="Descuento" class="form-control" id="inputNuevoDescuento"></input>
</div>
<div class="input-group col-xs-2">
<div class="input-group-addon">
<i class="fa fa-user-circle"></i>
</div>
<input type="number" name="cliente" class="form-control" placeholder="Nº cliente" id="inputNuevoCliente"></input>
</div>
<div class="input-group col-xs-2">
<div class="input-group-addon">
<i class="fa fa-check-square"></i>
</div>
<select class="form-control" id="selectEstadoNuevo" name="nuevoEstado">
<option value="vacio" selected>Estado:</option>
<option value="Pendiente">Pendiente</option>
<option value="Aceptado">Aceptado</option>
<option value="Rechazado">Rechazado</option>
</select>
</div>
<button id="guardarNuevoPedido" class="nuevos btn btn-primary">Guardar</button>
</div>
<h2 class="title2" hidden="hidden">Modificar Pedido</h2>
<div id="update-pedidos" class="row">
<div class="input-group col-xs-3">
<div class="input-group-addon">
<i class="fa fa-calendar"></i>
</div>
<input type="date" name="actualizarFecha" class="form-control" id="inputActualizarFecha"></input>
<input type="number" name="id" id="inputActualizarId" hidden="hidden"></input>
</div>
<div class="input-group col-xs-2">
<div class="input-group-addon">
<i class="fa fa-money"></i>
</div>
<input type="number" name="actualizarDescuento" placeholder="Descuento" class="form-control" id="inputActualizarDescuento"></input>
</div>
<div class="input-group col-xs-2">
<div class="input-group-addon">
<i class="fa fa-user-circle"></i>
</div>
<input type="number" name="cliente" class="form-control" placeholder="Nº cliente" id="inputActualizarCliente"></input>
</div>
<div class="input-group col-xs-2">
<div class="input-group-addon">
<i class="fa fa-check-square"></i>
</div>
<select class="form-control" id="selectEstadoActualizar" name="nuevoEstado">
<option value="vacio" selected>Estado:</option>
<option value="Pendiente">Pendiente</option>
<option value="Aceptado">Aceptado</option>
<option value="Rechazado">Rechazado</option>
</select>
</div>
<button id="guardarActualizarPedido" class="nuevos btn btn-primary">Guardar</button>
</div>
</div>
</div>
<?php
include('components/footer.php');
?>
<script src="../../js/jquery.js"></script>
<script src="../../js/bootstrap.min.js"></script>
<script src="../../js/sweetalert.min.js"></script>
<script src="../../js/operaciones-pedido.js"></script>
</body>
</html>