PHP - Pasar variable JS a PHP

 
Vista:
sin imagen de perfil
Val: 10
Ha aumentado su posición en 16 puestos en PHP (en relación al último mes)
Gráfica de PHP

Pasar variable JS a PHP

Publicado por Nostrum (9 intervenciones) el 10/08/2022 19:55:24
Buen día mis estimados

Vengo por aqui a molestar con un caso que seguramente ya se ha visto pero que yo no he podido resolver.

El cuento es que tengo un desarrollo de fullcalendar + bootstrap + php + mysql, donde puedo mostrar perfectamente los registros de mi base de datos en los dias respectivos y horas sin ningun problema.

El punto donde estoy estancado es en que necesito tener disponible el Id del registro que se encuentra en JS para poder ejecutar condicionales en una ventana modal en donde se van a mostrar valores segun esos condicionales

Les muestro un poco lo que estoy trabajando

Este seria el calendario que ve el usuario

Calendario

Aqui se puede observar que en los dias donde se ha registrado un servicio se muestra la hora y el servicio que se presta o prestará, hasta aqui todo muy bien, al hacer click en el servicio (cualquiera de ellos) se muestra una venta modal en donde se detalla la información mas completa del servicio en cuestión

Ventana modal

Calendario-modal

En esta ventana necesito tener disponible en PHP la variable Id que viene de JS, he probado ajax pero por alguna razon no me envia los datos al archivo php alterno

Les comparto la fraccion del código que tengo hasta el momento para ver si es posible que me echen una mano

Código JS que extrae y muestra los registros de la bd tanto al calendario como a la ventana modal
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<script>
	$(document).ready(function() {
		$('#calendar').fullCalendar
		({
			header:
			{
				left: 'prev,next today',
				center: 'title',
				right: 'month,agendaWeek,agendaDay'
			},
 
			defaultDate: Date(),
			navLinks: true, // can click day/week names to navigate views
			editable: true,
			eventLimit: true, // allow "more" link when too many events
			eventClick: function(event)
			{
				$('#visualizar #id').text(event.id);
 
				var Idprocesa = (event.id);
 
				$.ajax({
				  method: 'post',
				  url: 'agenda_procesa_id.php',
				  data: {Idprocesa},
				  success: function(response) {
					console.log(response);
					  alert (response)
				  }
				});
 
				$('#visualizar #start').text(event.start.format('DD/MM/YYYY HH:mm'));
				$('#visualizar #title').text(event.title);
				$('#visualizar #Clnt').text(event.Clnt);
				$('#visualizar #Status').text(event.Status);
				$('#visualizar').modal('show');
				return false;
			},
 
			events:
			[
				<?php
					while($Registro_Citas = mysqli_fetch_array($Query_Citas))
					{
				?>
						{
							id: '<?php echo $Registro_Citas['Id_citas'] ?>',
							title: '<?php echo $Registro_Citas['Serv_citas'] ?>',
							Clnt: '<?php echo $Registro_Citas['Clnt_citas'] ?>',
							start: '<?php echo $Registro_Citas['Dia_citas'] . " " . $Registro_Citas['Hora_citas'] ?>',
							Status: '<?php echo $Registro_Citas['Status_citas'] ?>',
							color: '#8B4513',
						},
				<?php
					}
				?>
			]
		});
	});
</script>

El archivo agenda_procesa_id.php tiene esto:

1
2
3
4
5
6
7
8
9
10
11
<?php
if (isset($_POST['Idprocesa']))
{
	$Id_procesa = $_POST['Idprocesa'];
	echo($Id_procesa);
}
else
{
	$Id_procesa = "No hay valor";
}
?>

Cuando llamo a la ventana modal para visualizar los datos indica que "no hay valor" es decir que la variable Idprocesa jamás llegó al archivo agenda_procesa_id.php

Agradezco mucho luces al respecto de por qué no me funciona o si bien tienen una mejor idea de como igualar la variable de JS con la de PHP se los agradeceré mucho
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Yoel
Val: 617
Bronce
Ha mantenido su posición en PHP (en relación al último mes)
Gráfica de PHP

Pasar variable JS a PHP

Publicado por Yoel (198 intervenciones) el 12/08/2022 00:33:16
Hola Nostrum, mira según puedo ver en tu código el valor del id lo estas trayendo en (event.id) creo que lo primero que debes ver si el valor del id esta correo y lo puedes hacer imprimiendo el resultado de la siguiente manera conselo.log(event.id). Ese valor lo puedes ver en la consola del navegador. En el caso que no te esté devolviendo ningún valor, por favor verifica que el query ($Query_Citas) que le hace a la base de datos este correcto y tenga el campo Id_citas. Un detalle que veo porque en lugar de insertar el código php dentro de javascript no lo traes en un json usando ajax.

Gracias
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 10
Ha aumentado su posición en 16 puestos en PHP (en relación al último mes)
Gráfica de PHP

Pasar variable JS a PHP

Publicado por Nostrum (9 intervenciones) el 12/08/2022 17:37:53
Hola Yoel gracias por tu respuesta

Verificando lo que me dices, es algo que ya he validado, si te fijas en el código tengo un alert que fue lo primero que utilicé para comprobar que el id esté llegando al modal, esto ocurre perfectamente en donde mismo indicas e incluso antes de abrirse el modal el navegador me muestra la tipica ventana de alerta de JS con el valor de la variable, por eso igualo Idprocesa con (event.id). En función a eso debería llevarme el valor del ID del registro de la BD a la variable para que sea enviada por ajax al archivo alterno PHP.

La verdad es que estoy un poco contrariado con esto y no comprendo como no lo hace de forma correcta, mi conocimiento en java es básico pero tampoco es que estoy programando la teoría cuántica de cuerdas.... xD

En fin, gracias por el aporte amigo, ya me había decepcionado con que este post no tenía ninguna respuesta y sé que por lo menos alguien lo ha leído
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Yoel
Val: 617
Bronce
Ha mantenido su posición en PHP (en relación al último mes)
Gráfica de PHP

Pasar variable JS a PHP

Publicado por Yoel (198 intervenciones) el 12/08/2022 18:07:12
Hola y gracias por contestar una disculpa por la demora, pero lo que sucede es no siempre estamos en el foro por eso hay veces que nos demoramos un poquito en contestar. El problema que tienes es que no se está pasando al elemento de html los datos del id por favor puede colocar el código html que estás usando para colocar él id de la base de datos.

Gracias
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 10
Ha aumentado su posición en 16 puestos en PHP (en relación al último mes)
Gráfica de PHP

Pasar variable JS a PHP

Publicado por Nostrum (9 intervenciones) el 12/08/2022 18:43:53
Gracias hermano por el apoyo

Fijate. El query a la BD es común y corriente, no hay nada especial en ello, de hecho funciona a la perfeccion porque los datos de la ventana modal que se me muestra son correctos para cada caso en el que se hace click, incluso me muestra el ID del registro de la BD

Es mas, te voy a dejar el código completo de PHP

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
<?php
include('acceso.php');
 
$Hoy = date('Y-m-d');
$Consulta_Citas = "SELECT * FROM citas WHERE (Status_citas = 'Activo' or Status_citas = 'Atendido')";
$Query_Citas = mysqli_query($cn, $Consulta_Citas);
?>
 
<!DOCTYPE html>
<html lang="es">
<head>
    <title>Calendario</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="robots" content="noindex">
    <meta name="googlebot" content="noindex">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="pragma" content="no-cache">
 
<!--===============================================================================================-->
    <link rel="shortcut icon" href="img/favicon.ico">
    <!-- Google Font: Source Sans Pro -->
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
    <!-- Font Awesome -->
    <link rel="stylesheet" href="fonts/fontawesome-free/css/all.min.css">
    <!-- Theme style -->
    <link rel="stylesheet" href="css/adminlte.css">
    <!-- Calendar -->
    <link href='css/fullcalendar.min.css' rel='stylesheet' />
    <link href='css/fullcalendar.print.min.css' rel='stylesheet' media='print' />
<!--===============================================================================================-->
 
</head>
<body class="hold-transition sidebar-mini layout-fixed layout-navbar-fixed layout-footer-fixed">
 
<div class="wrapper">
    <!-- Navbar -->
    <nav class="main-header navbar navbar-expand navbar-white navbar-light">
        <!-- Left navbar links -->
        <ul class="navbar-nav">
            <li class="nav-item">
                <a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars"></i></a>
            </li>
            <li class="nav-item">
                <form name="Home" id="Home" title="Menu Principal" action="menu.php">
                    <button type="submit" form="Home" class="btn-app fas fa-home"></button>
                </form>
            </li>
        </ul>
    </nav>
    <!-- /.navbar -->
 
    <?php
	include('menu_lateral.php');
    ?>
 
    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1><i class="nav-icon fas fa-home"></i>&nbsp;&nbsp;Calendario de Citas</h1>
                    </div>
                </div>
            </div>
            <!-- /.container-fluid -->
        </section>
 
        <!-- Main content -->
        <section class="content">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-md-4">
                        <div class="sticky-top mb-3">
                            <div class="card">
                                <div class="card-header" style="background-color: #258d19; color: #fff">
                                    <h3 class="card-title">Citas del día</h3>
                                </div>
                                <div class="card-body" style="width: auto; overflow: auto; padding: 2px;">
                                    <font style="font-size: 15px">
                                        <table class="table table-bordered table-hover text-nowrap">
                                            <thead>
                                                <tr align="center" style="background-color:blanchedalmond">
                                                    <th>Ver</th>
                                                    <th>Hora</th>
                                                    <th>Servicio</th>
                                                    <th>Cliente</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                            <?php
                                                $Cuenta = mysqli_num_rows(mysqli_query($acceso,"SELECT * FROM citas WHERE Dia_citas = '$Hoy' and (Status_citas = 'Activo' or Status_citas = 'Atendido') ORDER BY Hora_citas, Serv_citas ASC"));
                                                if ($Cuenta == 0)
                                                {
                                            ?>
                                                    <tr align="center">
                                                        <td colspan="4"><strong>No hay citas agendadas para hoy</strong></td>
                                                    </tr>
                                            <?php
                                                }
                                                else
                                                {
                                                    $result = mysqli_query($acceso,"SELECT * FROM citas WHERE Dia_citas = '$Hoy' and (Status_citas = 'Activo' or Status_citas = 'Atendido') ORDER BY Hora_citas, Serv_citas ASC");
                                                    while($row = mysqli_fetch_array($result))
                                                    {
                                                        $Id_citas = $row['Id_citas']
                                            ?>
                                                        <tr>
                                                            <td><a class="fas fa-edit" onclick="actualizar(this.id)" id="<?php echo $Id_citas ?>"></a></td>
                                                            <td><?php echo date("g:i a", strtotime($row['Hora_citas'])) ?></td>
                                                            <td><?php echo $row['Serv_citas'] ?></td>
                                                            <td><?php echo $row['Clnt_citas'] ?></td>
                                                        </tr>
                                            <?php
                                                    }
                                                }
                                            ?>
                                            </tbody>
                                        </table>
                                    </font>
                                </div>
                            </div>
                            <!-- /.card -->
 
                            <div class="card">
                                <div class="card-header" style="background-color: #258d19; color: #fff">
                                    <h3 class="card-title">Leyenda</h3>
                                </div>
                                <div class="card-body" style="width: 100%; overflow: auto; padding: 2px;">
                                    <font style="font-size: 15px">
                                        <button type="button" class="btn" style="background-color: #828282; cursor: default; margin: 6px"></button>
                                        Actualizada <br>
                                        <button type="button" class="btn" style="background-color: #c20000; cursor: default; margin: 6px"></button>
                                        Sin Actualizar <br>
                                        <button type="button" class="btn" style="background-color: #b57c00; cursor: default; margin: 6px"></button>
                                        Cita del día <br>
                                        <button type="button" class="btn" style="background-color: #258b19; cursor: default; margin: 6px"></button>
                                        Próxima
                                    </font>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- /.col -->
                    <div class="col-md-8">
                        <div class="card card-primary">
                            <div class="card-body p-0">
                                <!-- THE CALENDAR -->
                                <div id="calendar"></div>
                            </div>
                            <!-- /.card-body -->
                        </div>
                        <!-- /.card -->
                    </div>
                    <!-- /.col -->
                </div>
                <!-- /.row -->
            </div><!-- /.container-fluid -->
        </section>
        <!-- /.content -->
 
        <div class="modal fade" id="visualizar" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" data-backdrop="static">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header" style="background-color: #258d19; color: #fff">
                        <h4 class="modal-title text-left">Detalle de la Cita</h4>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    </div>
                    <div class="modal-body" style="background-color: #F9F9F9">
                        <dl class="alert">
                            <dt>Id</dt>
                            <dd id="id"></dd>
                            <dt>Servicio</dt>
                            <dd id="title"></dd>
                            <dt>Cliente</dt>
                            <dd id="Clnt"></dd>
                            <dt>Fecha y Hora</dt>
                            <dd id="start"></dd>
                            <dt>Id en PHP</dt>
                            <dd>
                                <?php
                                    include('agenda_procesa_id.php');
                                    echo $Id_procesa;
                                ?>
                            </dd>
                        </dl>
                    </div>
                </div>
            </div>
        </div>
 
 
    </div>
    <!-- /.content-wrapper -->
 
<?php
    include('zz_foot.php');
?>
 
</div>
<!-- ./wrapper -->
 
<!-- jQuery -->
<script src="js/jquery.min.js"></script>
<!-- Bootstrap 4 -->
<script src="js/bootstrap.bundle.min.js"></script>
<!-- AdminLTE App -->
<script src="js/adminlte.min.js"></script>
<!-- Calendar -->
<script src='js/bootstrap.min.js'></script>
<script src='js/moment.min.js'></script>
<script src='js/fullcalendar.min.js'></script>
<script src='js/locale/es-es.js'></script>
 
<script>
    $(document).ready(function()
    {
        $('#calendar').fullCalendar
        ({
            header:
            {
                left: 'prev,next today',
                center: 'title',
                right: ''
            },
            defaultDate: Date(),
            navLinks: true, // can click day/week names to navigate views
            editable: true,
            eventLimit: true, // allow "more" link when too many events
            eventClick: function(event)
            {
                $('#visualizar #id').text(event.id);
 
               var Idprocesa = (event.id);
 
				$.ajax({
				  method: 'post',
				  url: 'agenda_procesa_id.php',
				  data: {Idprocesa},
				  success: function(response) {
					console.log(response);
					  alert (response)
				  }
				});
 
                $('#visualizar #start').text(event.start.format('DD/MM/YYYY HH:mm'));
                $('#visualizar #title').text(event.title);
                $('#visualizar #Clnt').text(event.Clnt);
                $('#visualizar #Status').text(event.Status);
                $('#visualizar').modal('show');
                return false;
            },
 
            events:
            [
                <?php
                    while($Registro_Citas = mysqli_fetch_array($Query_Citas))
                    {
		?>
                        {
                            id: '<?php echo $Registro_Citas['Id_citas'] ?>',
                            title: '<?php echo $Registro_Citas['Serv_citas'] ?>',
                            Clnt: '<?php echo $Registro_Citas['Clnt_citas'] ?>',
                            start: '<?php echo $Registro_Citas['Dia_citas'] . " " . $Registro_Citas['Hora_citas'] ?>',
                            Status: '<?php echo $Registro_Citas['Status_citas'] ?>',
                            color: '#8B4513',
                        },
                <?php
                    }
                ?>
            ]
        });
    });
</script>
</body>
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Ivan

Pasar variable JS a PHP

Publicado por Ivan (118 intervenciones) el 12/08/2022 18:53:16
Hola,

no soy experto en jQuery ni ajax, pero conozco bién el JavaScript nativo y en el código:

1
2
3
4
5
6
7
8
9
$.ajax({
method: 'post',
url: 'agenda_procesa_id.php',
data: {Idprocesa},
success: function(response) {
console.log(response);
alert (response)
}
});

Envias la variable Idprocesa como un objeto data: {Idprocesa},
Esto es un error, o le envias la variable directamente con data: Idprocesa,
O le envias el objeto con su propiedades tipo data: {id: Idprocesa},

Espero haberte ayudado

Un saludo!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 10
Ha aumentado su posición en 16 puestos en PHP (en relación al último mes)
Gráfica de PHP

Pasar variable JS a PHP

Publicado por Nostrum (9 intervenciones) el 12/08/2022 19:08:58
Gracias amigo Ivan por comentar

Tomando en cuenta tu corrección, aplico varias opciones al código y en el alert no hay datos.

Probe de varias maneras y no muestra nada hasta que lo hice asi

1
2
3
4
5
6
7
8
9
10
11
12
13
$('#visualizar #id').text(event.id);
 
                var Idprocesa = (event.id);
 
				$.ajax({
				  method: 'post',
				  url: 'agenda_procesa_id.php',
				  data: {Idprocesa:(event.id)},
				  success: function(response) {
					console.log(response);
					  alert (response)
				  }
				});

Aqui en el alert veo el ID que necesito pero el resultado en PHP sigue siendo fallido, no tengo el valor en la variable Id_procesa

Gracias por apoyar
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Ivan

Pasar variable JS a PHP

Publicado por Ivan (118 intervenciones) el 15/08/2022 10:19:18
Hola,

vamos progresando poco a poco jeje.

Creo que el problema es el mismo, primero no asignabas bien la variable a data y ahora que ya tenemos que data es un objeto con esta estructura:

data = {
Idprocesa: valor_id
}

Creo que no pides correctamente el valor desde PHP. Repito que no soy experto en ajax pero si envias los datos con post y directamente pides

$_POST['Idprocesa']

Seguramente no estas pidiendo bien el valor dentro del objeto data.

Para ver lo que estas recibiendo en tu código PHP prueba a hacer un var_dump($_POST);
Te mostrará toda la estructura del Array $_POST y podrás ver la jerarquía hasta la variable Idprocesa.

Un saludo!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar