Enviar Div con Ajax

Zipus · #1 (**permalink**) 23/06/2012, 10:39

Tengo un div como este:

Código HTML:

Ver original<div id="value">125</div>

Me pregunto como hago para enviar por Ajax el 125, lo he intentado con .innerHTML y no me funciona.

Gracias! :)

maycolalvarez · #2 (**permalink**) 23/06/2012, 12:19

¿Seguro?, entonces muestra el código que tienes para ver en que te falla

ipraetoriux · #3 (**permalink**) 24/06/2012, 03:23

...puedes hacerlo de 2 formas...

JAVASCRIPT:

document.getElementById('value').innerHtml;

jQUERY

$('#value').text();

tambien puedes usar PROTOTYPE

Zipus · #4 (**permalink**) 24/06/2012, 11:34

Aquí hos dejo el codigo fuente, pero quizas no sea ese el error, disculpenme!

Código HTML:

Ver original<!DOCTYPE html>
<html>
<head>
  <title>Radar Display</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
 <script src="inc/key.js" type="text/javascript"></script>
<script>
function objetoAjax(){
  var xmlhttp=false;
  try {
    xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
    try {
       xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (E) {
      xmlhttp = false;
      }
  }
 
  if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
    xmlhttp = new XMLHttpRequest();
  }
  return xmlhttp;
}
 
 shortcut.add("left",function() {
  var minus = document.getElementById("value").innerHTML;
  var sum =  parseInt(minus) -5;
  document.getElementById("value").innerHTML = sum;
   ajax=objetoAjax();
   ajax.open("POST", "update.php",true);
   divResultado = document.getElementById('response');
   divResultado.innerHTML = '<div id="response"></div>';
   ajax.onreadystatechange=function()
    {
        if (ajax.readyState==4)
        {
            divResultado.innerHTML = ajax.responseText
        }
    }
    ajax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    ajax.send("sumar="+sum)    
  });
 shortcut.add("right",function() {
   var more = document.getElementById("value").innerHTML;
  var sum =  parseInt(more) +5;
  document.getElementById("value").innerHTML = sum;
   ajax=objetoAjax();
   ajax.open("POST", "update.php",true);
   divResultado = document.getElementById('response');
   divResultado.innerHTML = '<div id="response"></div>';
   ajax.onreadystatechange=function()
    {
        if (ajax.readyState==4)
        {
            divResultado.innerHTML = ajax.responseText
        }
    }
    ajax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    ajax.send("sumar="+sum)    
  });
</script>
</head>
<body>   
    <div id="value">0</div>
    <div id="response"></div>
</body>
</html>

maycolalvarez · #5 (**permalink**) 24/06/2012, 13:18

Puede deberse a que tratas de obtener el innerHTML cuando el DOM no esta cargado, por lo cual necesitas llamar a la función shortcut.add desde el evento onload de la pagina, o usar alguna función domready de cualquier framework como jQuery.

Otro punto importante es que en el onreadystatechange sólo evalúas readyState==4 cuando también debes evaluar status==200, consulta un manual de AJAX

Zipus · #6 (**permalink**) 24/06/2012, 13:22

El valor se actualiza cuando pulso la tecla dirección izquierda y derecha, por lo que la función shortcut.add funciona perfectamente.

De todas formas estoy usando el js de aqui, no es un script propio:
http://www.openjs.com/scripts/events/keyboard_shortcuts/

maycolalvarez · #7 (**permalink**) 25/06/2012, 07:39

el hecho es que no le funciona, y tampoco aplica las recomendaciones que se le indican, de esa forma el feedback falla y por lo tanto no tengo en que más ayudarle.

el hecho de que sea un script publicado en línea no quiere decir que no contenga errores, y el usar ajax sin comprobar el status==200 (Protocolo HTTP) es el error de principiante más básico que se comete al aprender AJAX, el que no oye consejo...no llega a viejo.