elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Estamos en la red social de Mastodon


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web
| | |-+  PHP (Moderador: #!drvy)
| | | |-+  [Resuelto] [Newbie] No puedo acceder a objeto JSON enviado por AJAX		0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: [Resuelto] [Newbie] No puedo acceder a objeto JSON enviado por AJAX  (Leído 4,976 veces)
iGust4v0x

Desconectado Desconectado

Mensajes: 8


Ver Perfil
[Resuelto] [Newbie] No puedo acceder a objeto JSON enviado por AJAX
« en: 14 Enero 2015, 05:43 am »
Buenas noches. Tengo un pequeño problema con AJAX y PHP.

Lo que intento realizar un buscador en tiempo real, como el de AngularJS. Lo que deseo que haga es lo siguiente:

  • Enviar un objeto JSON por medio de AJAX hacia un script PHP.
  • El retorno de datos quiero que sea opcional (actualmente, si no retorno un json desde mi script PHP con json_encode($array_asociativo), me lanza un parserrror.
  • Una vez obtenido el dato del objeto JSON realizar una consulta a la BD para buscar matches (full text).
  • En el método done() del método AJAX de jQuery, recargar la tabla por medio del método load("path/to/file.php").

    Nota: Si le pongo dataType: "json" y no devuelvo nada en el script PHP me genera un parserror y el AJAX falla.

    Bien, mi estructura de fichers es la siguiente:

    ROOT -> app y public
    app -> views -> templates -> users-table.php
    public -> js, css, img e index.php

    index.php

    Código
    1. <?php
    2. require_once($_SERVER["DOCUMENT_ROOT"]."/UsuariosCRUD/app/utils/path-dirs.php");
    4. if(!isset($_SESSION["is-search"])) {
    5. 	$_SESSION["is-search"] = FALSE;
    6. }
    7. ?>
    8. <!DOCTYPE html>
    9. <html lang="en">
    10. <head>
    11. 	<meta charset="UTF-8">
    12. 	<title>CRUD Usuarios PHP - AJAX</title>
    13. 	<link rel="stylesheet" href="public/css/usuarios.css"/>
    14. 	<link rel="icon" href="public/img/favicon2.ico"/>
    15. </head>
    16. <body>
    17. 	<header class="header">
    18. 		<nav class="navbar">
    19. 			<h1 class="header-title">CRUD de usuarios con PHP y AJAX</h1>
    20. 		</nav>
    21. 	</header>
    22.  
    23. 	<main class="main">
    24. 		<!-- Textfield para filtrar usuarios -->
    25. 		<input type="text" id="text-search" class="textfield search" placeholder="Busque un usuario aquí"/>
    26. 		<!-- Boton para agregar usuario nuevo -->
    27. 		<button type="button" id="new-user" class="btn btn-primary action-option"
    28. 		data-action="create-user">Nuevo</button>
    29.  
    30. 		<!-- tabla de usuarios -->
    31. 		<section id="datatable">
    32. 		<?php
    33. 			require_once($app_dir."views/templates/users-table.php");
    34. 		?>
    35. 		</section>
    36.  
    37. 		<button type="button" id="destroy-session" class="btn btn-danger"
    38. 		style="margin-left: 133px">Resetear</button>
    39.  
    40. 		<!-- ventanas modales -->
    41. 		<?php
    42. 			require_once($app_dir."views/templates/modal-windows.php");
    43. 		?>
    44. 	</main>
    45.  
    46. 	<script src="public/js/destroy-php-session.js"></script>
    47. </body>
    48. </html>
    49.  

    ajax.js

    Código
    1. $("#text-search").on("keyup", function() {
    2. 		var word = $(this).val();
    3. 		console.log(word);
    4. 		//var dataToSend = JSON.parse('{"text": "'+word+'"}');
    5. 		/*var data = {"text": word};
    6. 		dataToSend = JSON.parse(JSON.stringify(data));*/
    7.  
    8. 		$.ajax(
    9. 			{
    10. 				url: "app/utils/user/search-users.php",
    11. 				//dataType: "json",
    12. 				data: {text: "García"},
    13. 				type: "GET",
    14. 			}
    15. 		)
    16. 		.done(function() {
    17. 			$("#datatable").load("app/views/templates/users-table.php");
    18. 			$("#text-search").focus();
    19. 			console.log("Success");
    20. 		})
    21. 		.fail(function(jqXHR, textStatus, errorThrown) {
    22. 			console.log(textStatus);
    23. 			console.log("Fail");
    24. 		})
    25. 		.always(function(jqXHR, textStatus, errorThrown) {
    26.  
    27. 		});
    28. 	});
    29.  
    30. });

    search-users.php

    Código
    1. <?php
    2. if(!isset($_SESSION)) {
    3.     session_start();
    4.     $_SESSION["is-search"] = TRUE;
    5. }
    6. require_once($_SERVER["DOCUMENT_ROOT"]."/UsuariosCRUD/app/utils/path-dirs.php");
    7. require_once($app_dir."services/user/UserService.class.php");
    8.  
    9.  
    10. // obtiene los usuarios de la bd
    11. $users = null;
    12. if($_SESSION["is-search"] === TRUE) {
    13.     $text = $_GET["text"];
    14.     //$text = "garcia";
    15.     $query = "SELECT * FROM user WHERE MATCH(userId,names,surnames,dni,address,phone,email)
    16.         AGAINST('garcía')";
    17.     $users = UserService::getInstance()->query($query);
    18. }

    users-table.php

    Código
    1. <?php
    2. require_once($_SERVER['DOCUMENT_ROOT'].'/UsuariosCRUD/app/utils/path-dirs.php');
    3. if(!isset($_SESSION)) {
    4.     session_start();
    5. }
    6. if($_SESSION["is-search"] === TRUE)
    7.     require_once($app_dir."utils/user/search-users.php");
    8. else
    9.     require_once($app_dir.'utils/user/obtener-usuarios.php');
    10. ?>
    11. <table id="table" class="table" style="width: auto; margin: 10px auto">
    12.     <thead>
    13.         <tr>
    14.             <th>ID</th>
    15.             <th>Nombres</th>
    16.             <th>Apellidos</th>
    17.             <th>DNI</th>
    18.             <th>Dirección</th>
    19.             <th>Teléfono</th>
    20.             <th>Email</th>
    21.             <th>Acción</th>
    22.         </tr>
    23.     </thead>
    24.     <tbody>
    25.         <?php
    26.         $actionLinks =
    27.         '<a class="action-option" data-action="user-info">'.
    28.         '<span class="nowrap"><span class="icon icon-info icon-margin icon-info-margin"></span></span>'.
    29.         'Ver'.
    30.         '</a>'.
    31.         '<a class="action-option" data-action="edit-user">'.
    32.         '<span class="nowrap"><span class="icon icon-edit icon-margin"></span></span>'.
    33.         'Editar'.
    34.         '</a>'.
    35.         '<a class="action-option" data-action="drop-user">'.
    36.         '<span class="nowrap"><span class="icon icon-drop icon-margin icon-drop-margin"></span></span>'.
    37.         'Remover'.
    38.         '</a>';
    39.         $rowIndex = 1;
    40.         while($row = $users->fetch_assoc()) {
    41.             echo "<tr data-row-index=".$rowIndex.">";
    42.             echo "<td>".$row["userId"]."</td>";
    43.             echo "<td>".$row["names"]."</td>";
    44.             echo "<td>".$row["surnames"]."</td>";
    45.             echo "<td>".$row["dni"]."</td>";
    46.             echo "<td>".$row["address"]."</td>";
    47.             echo "<td>".$row["phone"]."</td>";
    48.             echo "<td>".$row["email"]."</td>";
    49.             echo "<td>".$actionLinks."</td>";
    50.             echo "</tr>";
    51.             $rowIndex++;
    52.         }
    53.         ?>
    54.     </tbody>
    55. </table>


    Screenshot:





    Gracias.
« Última modificación: 14 Enero 2015, 22:00 pm por #!drvy » En línea
engel lex
Moderador Global
***
Desconectado Desconectado

Mensajes: 15.514



Ver Perfil
Re: [Newbie] No puedo acceder a objeto JSON enviado por AJAX
« Respuesta #1 en: 14 Enero 2015, 05:52 am »
si solicitas un tipo de dato no puedes retornar vacio, ya que JSON no tiene predeterminado vacio, debes retornar siempre un JSON valido (así sea solo {}), si no consigues nada, retorna la transformación a json de "false" solo...

acostúmbrate a eso... siempre debes retornar datos, ya sea para decir, que está mal, o hubo error... eso siempre resuelve muchos problemas y por eso tipos de datos como json lo obligan...

sin embargo no veo en ningún lugar que retornes datos en formato json...

tu problema es el parse error o tienes alguna duda?
En línea
El problema con la sociedad actualmente radica en que todos creen que tienen el derecho de tener una opinión, y que esa opinión sea validada por todos, cuando lo correcto es que todos tengan derecho a una opinión, siempre y cuando esa opinión pueda ser ignorada, cuestionada, e incluso ser sujeta a burla, particularmente cuando no tiene sentido alguno.
iGust4v0x

Desconectado Desconectado

Mensajes: 8


Ver Perfil
Re: [Newbie] No puedo acceder a objeto JSON enviado por AJAX
« Respuesta #2 en: 14 Enero 2015, 06:06 am »
Gracias por responder. Respecto a tus recomendaciones, eso lo tengo claro. Soy newbie en PHP pero tengo algo de experiencia en el mundo JEE.

Me disculparás las, quizás, estupideces que hago en PHP, pero es que recién no llevo ni una semana con el lenguaje xD.

Lo que pasa es que si retorno un objeto JSON de vuelta a a llamada AJAX, como se hace por medio de 'echo', el objeto JSON se va a imprimir en pantalla (ver imagen más abajo), y eso queda fuera de lugar.

Según tengo entendido, obviando el parámetro dataType no es obligatorio devolver el JSON desde PHP, y eso es lo que pretendo hacer.

Actualizaciones de código:

ajax.js

Código
  1. $.ajax(
  2. 			{
  3. 				url: "app/utils/user/search-users.php",
  4. 				dataType: "json",
  5. 				data: {text: "García"},
  6. 				type: "GET",
  7. 			}
  8. 		)
  9. 		.done(function(data) {
  10. 			$("#datatable").load("app/views/templates/users-table.php");
  11. 			$("#text-search").focus();
  12.                 ....

search-users.php

Código
  1. $users = null;
  2. if($_SESSION["is-search"] === TRUE) {
  3.     $text = $_GET["text"];
  4.     $query = "SELECT * FROM user WHERE MATCH(userId,names,surnames,dni,address,phone,email)
  5.         AGAINST('".$text."')";
  6.     $users = UserService::getInstance()->query($query);
  7. }
  8. $response = array("mensaje" => "Respuesta");
  9. echo json_encode($response);

Screenshot:
« Última modificación: 14 Enero 2015, 15:42 pm por #!drvy » En línea
JorgeEMX
Ex-Staff
*
Desconectado Desconectado

Mensajes: 2.615



Ver Perfil WWW
Re: [Newbie] No puedo acceder a objeto JSON enviado por AJAX
« Respuesta #3 en: 14 Enero 2015, 06:45 am »
Para que tu respuesta sea tomada como JSON debes agregar el tipo de contenido con un header:

Cita de: iGust4v0x en 14 Enero 2015, 06:06 am

search-users.php

Código
  1. $users = null;
  2. if($_SESSION["is-search"] === TRUE) {
  3.     $text = $_GET["text"];
  4.     $query = "SELECT * FROM user WHERE MATCH(userId,names,surnames,dni,address,phone,email)
  5.         AGAINST('".$text."')";
  6.     $users = UserService::getInstance()->query($query);
  7. }
  8. $response = array("mensaje" => "Respuesta");
  9.  
  10. header('Content-Type: application/json');
  11. echo json_encode($response); exit;
  12.  
En línea
Siempre hay algo nuevo que aprender
Mi canal de YOUTUBE: https://www.youtube.com/channel/UCt1WPhzdZW7tRTe5I5USkGQ
iGust4v0x

Desconectado Desconectado

Mensajes: 8


Ver Perfil
Re: [Newbie] No puedo acceder a objeto JSON enviado por AJAX
« Respuesta #4 en: 14 Enero 2015, 14:32 pm »
Gracias por contestar JorgeEMX.

La misma situación que muestra el screenshot anterior. No consigo hacer funcionar el buscador, bien indicando el dataType en el método ajax() de jQuery o bien obviándolo para no imprimir nada en el HTML.

Saludos.

UPDATE

Solo he agregado éstas líneas a search-users.php:

Código
  1. var_dump($_REQUEST);
  2. header('ContentType: application/json');
  3. echo json_encode($_REQUEST);

Y en el JS:

Código
  1. var dataToSend = JSON.parse('{"text": "'+word+'"}');
  2.  
  3. 		$.ajax(
  4. 			{
  5. 				url: "app/utils/user/search-users.php",
  6. 				//dataType: "json",
  7. 				data: dataToSend,
  8. 				type: "POST",
  9. 			}
  10. 		)
  11. 		.done(function(data) {
  12. 			$("#datatable").load("app/views/templates/users-table.php");
  13. 			$("#text-search").focus();
  14. 			//console.log("Success");
  15. 			console.log(data);


Screnshot:


Al imprimir el array $_REQUEST que envié devuelta a AJAX, me muestra los datos que estoy digitando. Pero el var_dump que hago en el script PHP, me muestra un array vacío.

Como dije soy nuevo en PHP y no entiendo bien por qué pasa ésto. ¿Si en JS me muestra que $_REQUEST no está vacío, por qué el var_dump me indica que sí?

Un saludo.

UPDATE

Si coloco el dataType y retorno un JSON desde PHP, me muestra parseerror (método fail() de jqXHR de AJAX).

Código
  1. if($_SESSION["is-search"] === TRUE) {
  2.     $text = "garcía";
  3.     if(isset($_REQUEST["text"]))
  4.         $text = $_REQUEST["text"];
  5.     $query = "SELECT * FROM user WHERE MATCH(userId,names,surnames,dni,address,phone,email)
  6.         AGAINST('".$text."')";
  7.     $users = UserService::getInstance()->query($query);
  8.     var_dump($_REQUEST);
  9.     header('ContentType: application/json');
  10.     $response = array("request" => json_encode($_REQUEST));
  11.     echo json_encode($response);
  12. }

Código
  1. $.ajax(
  2. 			{
  3. 				url: "app/utils/user/search-users.php",
  4. 				dataType: "json",
  5. 				data: dataToSend,
  6. 				type: "POST",
  7. 			}
  8. 		)

La consola muestra (imprimo el textStatus en el método fail): parseerror
« Última modificación: 14 Enero 2015, 15:23 pm por iGust4v0x » En línea
MinusFour
Moderador Global
***
Desconectado Desconectado

Mensajes: 5.529


I'm fourth.


Ver Perfil WWW
Re: [Newbie] No puedo acceder a objeto JSON enviado por AJAX
« Respuesta #5 en: 14 Enero 2015, 15:21 pm »
Realmente el texto que se imprime es por esto:
Código
  1. $("#datatable").load("app/views/templates/users-table.php");

Porque ese script en php esta incluyendo la respuesta json_encode de tu archivo searc-users.php. Te aconsejaria que replantearas la logica de tu vista.
En línea
iGust4v0x

Desconectado Desconectado

Mensajes: 8


Ver Perfil
Re: [Newbie] No puedo acceder a objeto JSON enviado por AJAX
« Respuesta #6 en: 14 Enero 2015, 21:12 pm »
Muchas gracias por responder @MinusFour (Y).

Voy a replantear la lógica de la vista como me aconsejas y cualquier problema que tenga (abusando de su confianza xD) actualizaré el post.

Un saludo.


Al fín pude solucionar el problema, y todo empezó por la idea de @MinusFour (gracias).

Código
  1. if($_SESSION["is-search"] === TRUE) {
  2.  
  3.     unset($_SESSION["users"]);
  4.     $text = $_REQUEST["text"];
  5.  
  6.     $query = "SELECT * FROM user WHERE MATCH(userId,names,surnames,dni,address,phone,email)
  7.     AGAINST('$text')";
  8.     $usersFinded = UserService::getInstance()->query($query);
  9.  
  10.     while($row = mysqli_fetch_array($usersFinded)) {
  11.         $_SESSION["users"][] = $row;
  12.     }
  13.  
  14.     header('ContentType: application/json');
  15.     echo json_encode(array("ususarios" => $_SESSION["users"]));
  16. }
  17.  
  18. if($_SESSION["is-search"] === FALSE ) {
  19.     unset($_SESSION["users"]);
  20.     $allUsers = UserService::getInstance()->selectAll();
  21.     while($row = mysqli_fetch_array($allUsers)) {
  22.         $_SESSION["users"][] = $row;
  23.     }
  24. }

Código
  1. var word = $(this).val();
  2. 		var dataToSend = JSON.parse('{"text": "'+word+'"}');
  3.  
  4. 		$.ajax(
  5. 			{
  6. 				url: "app/utils/user/search-users.php",
  7. 				dataType: "json",
  8. 				data: dataToSend,
  9. 				type: "GET",
  10. 			}
  11. 		)

Decidí usar variables de sesión para guardar los usuarios, y un estado para al momento de cargar los datos en la tabla, obtenga los usuarios dependiendo si es una búsqueda o solo una carga de todos los usuarios.

Saludos.

Mod: No hacer doble post.
« Última modificación: 14 Enero 2015, 22:00 pm por #!drvy » En línea
JorgeEMX
Ex-Staff
*
Desconectado Desconectado

Mensajes: 2.615



Ver Perfil WWW
Re: [Newbie] No puedo acceder a objeto JSON enviado por AJAX
« Respuesta #7 en: 14 Enero 2015, 21:23 pm »
Es muy curiosa la forma en la que estás combinando el AJAX y cargar los resultados si encuentras o no resultado.  :rolleyes:
En línea
Siempre hay algo nuevo que aprender
Mi canal de YOUTUBE: https://www.youtube.com/channel/UCt1WPhzdZW7tRTe5I5USkGQ
iGust4v0x

Desconectado Desconectado

Mensajes: 8


Ver Perfil
Re: [Newbie] No puedo acceder a objeto JSON enviado por AJAX
« Respuesta #8 en: 14 Enero 2015, 21:46 pm »
¿Por curiosa quieres decir un desastre? jajaja
En línea
Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
Verificar Existencia de Array Enviado desde PHP a JS en forma de JSON
PHP 		spysecurityca 4 2,925 Último mensaje 22 Agosto 2014, 18:52 pm
por engel lex
[Resuelto] problema con datatables para acceder a un valor del objecto json
Desarrollo Web 		gAb1 0 2,460 Último mensaje 6 Enero 2016, 02:52 am
por gAb1
[Resuelto] ¿Como puedo obtener una URL con PHP desde un archivo AJAX? « 1 2 »
Desarrollo Web 		Leguim 11 5,890 Último mensaje 20 Agosto 2019, 01:14 am
por MinusFour
JSON PHP return de json_decode($json) no es un objeto?
PHP 		@XSStringManolo 6 3,366 Último mensaje 24 Diciembre 2019, 19:29 pm
por MinusFour
[Resuelto] Acceder elemento de objeto javascript « 1 2 »
Desarrollo Web 		GMB 10 6,984 Último mensaje 14 Febrero 2020, 22:42 pm
por @XSStringManolo
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines