Hola.
Estoy realizando una petición ajax y me esta devolviendo una cadena pero no consigo leer nada de esta cadena, sin duda porque estoy haciendo . En el php en el que hago la petición en el servidor, paso la consulta a JSON y previamente he pasado esta consulta a un array para poder leerlo con javascript.
En resumen:
1 - Realizo la petición AJAX.
2 - Hago la consulta en el php.
3 - Transformo esta consulta a un array
4 - Trato este array mediante una función para poder leer estos datos con javascript.
5 - Codifico este array con JSON para transmitirlo.
6 - Lo recibo en el html con javascript.
7 - A partir de aquí me vienen las muchas dudas. Si lo intento descodificar para poder leerlo, el javascript me da un error en el momento que pongo JSON.parse.
¿Esto último se puede dar porque no se puede pasar el JSON codificado como una cadena de texto con responseText?
Adjunto el código por si alguien puede ayudarme y decirme como leer los elementos de este imagino que array.
Código Javascript
:
Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<meta name="author" content="SyToo" />
<script type="text/javascript" src="json.js"></script>
<script type="text/javascript">
var title1;
var idcurso;
var idasignatura;
var idtema;
var curso;
var asignatura;
var tema;
var usuario;
var myArr;
var capaContenedora;
function inicio(){
var vars=[];
query=window.location.search.substring(1);
q=query.split("&");
for(i=0;i<q.length;i++){
x=q[i].split("=");
k=x[0];
v=x[1];
vars[k]=v;
}
idcurso = vars['idcurso'];
idasignatura = vars['idasignatura'];
curso = vars['curso'];
asignatura = vars['asignatura'];
tema = vars['tema'];
idtema = vars['idtema'];
usuario = vars['usuario'];
title1 = curso+' - '+asignatura+' - '+tema;
document.title = unescape(title1);
verCabecera();
verUsuario();
FAjax('devuelveArray.php', 'capaContenedora', 'idtema='+idtema, 'POST');
}
function verCabecera(){
document.getElementById('cat').innerHTML = unescape(title1);
}
function verUsuario(){
document.getElementById('usu').innerHTML = unescape(usuario);
}
function creaAjax(){
var objetoAjax = false;
try {
// Para navegadores distintos a Internet Explorer.
objetoAjax = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
// Para Explorer.
objetoAjax = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (E) {
objetoAjax = false;
}
}
if(!objetoAjax && typeof XMLHttpRequest != 'undefined') {
objetoAjax = new XMLHttpRequest();
}
return objetoAjax;
}
function FAjax(url, capa, valores, metodo){
var ajax = creaAjax();
//Creamos y ejecutamos la instancia si el método elegido es POST.
if (metodo.toUpperCase() == 'POST') {
ajax.open('POST', url, true);
ajax.onreadystatechange = function(){
procesaAjax(ajax, capa);
}
ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
ajax.send(valores);
return;
}
//Creamos y ejecutamos la instancia si el método elegido es GET.
if (metodo.toUpperCase() == 'GET') {
ajax.open('GET', url, true);
ajax.onreadystatechange = function(){
procesaAjax(ajax, capa);
}
ajax.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
ajax.send(null);
return;
}
}
function procesaAjax(ajax, capa){
capaContenedora = document.getElementById(capa);
if (ajax.readyState == 1) {
capaContenedora.innerHTML = "Cargando.......";
} else if (ajax.readyState == 4) {
if (ajax.status == 200) {
myArr = replaceAll(ajax.responseText, '|', '"');
//capaContenedora.innerHTML = myArr;
procesarArray();
} else if (ajax.status == 404) {
capaContenedora.innerHTML = "La dirección no existe";
} else {
capaContenedora.innerHTML = "Error: " + ajax.status;
}
}
}
function procesarArray(){
myArray = JSON.parse(myArr);
capaContenedora.innerHTML = myArray;
}
function replaceAll( text, busca, reemplaza ){
while (text.toString().indexOf(busca) != -1) {
text = text.toString().replace(busca,reemplaza);
}
return text;
}
</script>
<title></title>
<style>
h2 {
font-family: Arial, Helvetica, sans-serif;
font-size: 22px;
color : red;
margin : 6px;
}
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
background-color: #F5DEB3;
}
li, td {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
}
hr {
color: #FF0000;
width:70%;
text-align:center;
}
a {
color: #000000
}
input.error{
background-color : silver;
border : 1px solid black;
}
#volver, #pregunta{
text-align:center;
}
#pregunta, #respuesta1, #respuesta2, #respuesta3, #respuesta4{
padding-left: 7px;
}
#capaContenedora{
border-style: groove double;
padding: 10px;
margin: 14px;
border-color: blue;
}
</style>
</head>
<body>
<table width=100% border=0 cellspacing = 0 background='imagenes/indice1.jpg'>
<tr>
<td rowspan = 2>
<a href = "do_cursos.php"><img src="imagenes/libro.png" alt="Anagrama Aprendetu" border=0
align=left valign=bottom height = 60 width = 247></a>
</td>
<td align = right valign = bottom>
</td>
</tr>
</table>
<h2 id='cat'></h2>
Tu usuario es: <b id='usu'></b>
Este es el ejemplo de envío recepción de datos por AJAX<br /><br />
<!--<div style="text-align: center;">
<form method="post" onsubmit="FAjax('devuelveArray.php', 'capaContenedora', 'idtema='+idtema, 'POST'); return false" action="#">
<input type="hidden" id="idtema" value="" />
<div><input type="submit" value="enviar" /></div>
</form>
</div>-->
<div id="capaContenedora">Capa que recibirá los datos</div>
<script>
// Recupero los parámetros de entrada y cargo el campo oculto idtema.
inicio();
//document.getElementById('curso').value = idcurso;
</script>
</body>
</html>
Código PHP:
Ver original<?
include ('aprendetu_sc_fns.php');
// Necesitamos una sesión, así que empezar una
?>
<LINK rel="stylesheet" type="text/css" href="cuerpo.css">
<?php
$array_preguntas = array();
$idtema = $_POST['idtema'];
// Obtener las preguntas relacionadas con el tema seleccionado
$preguntas = get_preguntas($idtema);
$usuario = $_SESSION['usuario'];
$_SESSION['num_preguntas'] = $numero_preguntas;
$_SESSION['indice_array'] = 0;
$_SESSION['aciertos'] = 0;
$_SESSION['primeraVez'] = true;
if ($numero_preguntas > 0){
// Array que contendrá las filas de nuestra consulta
for($i=0; $i<$numero_preguntas; $i++) {
}
PHPtoJS($array_preguntas);
$oJSON = new JSON();
$myArr = $oJSON->encode($array_preguntas);
//echo "valor de myArr: ".$myArr;
if ($_GET) {
echo "Valores del formulario con el método GET: <pre>";
echo "</pre>";
}
if ($_POST) {
echo "Valores del formulario con el método POST: <pre>";
echo "</pre>";
}
} else {
echo "<p>Este tema actualmente no tiene preguntas/respuestas a realizar</p>";
}
?>
Dentro del anterior include está el include_once("JSON.php");
Muchas gracias a todos y saludos.