2011-05-09 17 views
10

Cómo almacenar cadena Json en un campo de entrada oculto. Bueno, podría hacerlo programáticamente, pero hay algo mal con escapar. Desde mi cadena es moderadamente largo, es difícil escapar "char para todos los nombres. Por favor, explique cómo funciona mediante programación (fase 1), ya que la salida de la consola se ve igual.Almacenar cadena JSON en el valor del campo de entrada

[{"X":0,"Y":0,"W":0,"H":500},{"X":358,"Y":62,"W":200,"H":500}]test2.html:21 [{"X":0,"Y":0,"W":0,"H":500},{"X":358,"Y":62,"W":200,"H":500}] test2.html:22 PASSED PHASE 1
jquery.min.js:16Uncaught SyntaxError: Unexpected end of input

gracias,

BSR


<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE HTML><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<head> 
<title>Test</title> 
<meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" /> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
</head> 
<body> 
     <input type="hidden" id="jsondata" /> 
     <input type="hidden" id="jsondata2" value="[{"X":0,"Y":0,"W":0,"H":500},{"X":358,"Y":62,"W":200,"H":500}]"/> 


    <script > 
      $(document).ready(function() { 

      myItems = [{"X":0,"Y":0,"W":0,"H":500}, 
        {"X":358,"Y":62,"W":200,"H":500}] 

      console.log(JSON.stringify(myItems)); 
      $("#jsondata").val(JSON.stringify(myItems)); 
      console.log(document.getElementById("jsondata").value); 
      console.log("PASSED PHASE 1"); 

      var obj = jQuery.parseJSON($("#jsondata2").val()); 
      console.log(obj.length);  
      console.log("PASSED PHASE 2");   
     }); 
    </script> 
</body> 
</html> 

Editar:.

funciona el siguiente código ... no estoy seguro de si es correcto. entonces marcará una buena explicación como respuesta. Gracias.

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE HTML><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<head> 
<title>Test</title> 
<meta http-equiv="content-type" content="application/xhtml+xml; charset=utf-8" /> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
</head> 
<body> 
     <input type="hidden" id="jsondata" /> 
     <input type="hidden" id="jsondata2" value='[{"X":0,"Y":0,"W":0,"H":500},{"X":358,"Y":62,"W":200,"H":500}]'/> 


    <script > 
      $(document).ready(function() { 

      myItems = [{"X":0,"Y":0,"W":0,"H":500}, 
        {"X":358,"Y":62,"W":200,"H":500}] 

      console.log(JSON.stringify(myItems)); 
      $("#jsondata").val(JSON.stringify(myItems)); 
      console.log(document.getElementById("jsondata").value); 
      console.log("PASSED PHASE 1"); 

      var obj = jQuery.parseJSON($("#jsondata2").val()); 
      console.log($("#jsondata2").val()); 
      console.log(obj[0].H); 
      console.log("PASSED PHASE 2");   
     }); 
    </script> 
</body> 
</html> 
+1

¿usted está queriendo guardar esto en un campo oculto para que lo pueda usar posteriormente o estabas pensando para enviarlo a través de un formulario? –

+0

Estoy almacenando la cadena Json en un campo oculto, y el valor se muestra a través de la plantilla en el lado del servidor.En el lado del cliente, lo analizo en conjunto de objetos y lo uso para una mayor representación – bsr

+0

Ok ... lo siguiente funcionó ... \t \t , si alguien tiene una buena explicación, la marcaré como respuesta. Gracias por su ayuda. – bsr

Respuesta

2

el código HTML es válido ... si ejecuta validador html Againt la primera html (no trabaja uno) se encuentran errores en la línea ...

+0

buena captura ... primer error sobre el espacio de nombres, porque el archivo era originalmente un archivo xhtml, luego solo eliminé algunas partes ... el segundo error, sobre espaciado adicional, no estoy seguro ... necesito leer más ... gracias – bsr

0

Pruebe el siguiente código, parece que tiene una matriz, no es un objeto para mí.

myItems = { data : [{"X":0,"Y":0,"W":0,"H":500}, 
        {"X":358,"Y":62,"W":200,"H":500}] }; 
+0

Creo que te estás perdiendo el sentido de la pregunta. Él pregunta por qué cuando los datos se inyectan al campo a través de JavaScript funcionan, pero cuando los datos están en el atributo de valor del campo, no. – Gazler

+0

@Gazler: no es mi entendimiento. Veo 'stringify()' work y 'parseJSON()' no funciona. 'parseJSON()' falla porque no es JSON válido. Doy JSON válido: resuelto. – Hogan

+0

@Hogan, si ejecuta el código, verá que los dos métodos se están ejecutando con datos diferentes. Ambos, stringify() y parseJSON() funcionan. – Gazler

6
<input type="hidden" id="jsondata2" value="[{"X":0,"Y":0,"W":0,"H":500},{"X":358,"Y":62,"W":200,"H":500}]"/> 

no es correcto. Use comillas simples ' en lugar de las comillas dobles " en la cadena de valor para solucionarlo (o escapar de la ")

<input type="hidden" id="jsondata2" value="[{'X':0,'Y':0,'W':0,'H':500},{'X':358,'Y':62,'W':200,'H':500}]"/> 
+1

La coloración SO es una buena ayuda para encontrar problemas como ese. –

+0

que no es concluyente; consulte el ejemplo de jQuery API para parseJSON var obj = jQuery.parseJSON ('{"name": "John"}'); Alerta (obj.name === "John"); .. esto funciona – bsr

+5

también, http://www.json.org/, con mucho, el error más común que he encontrado se relaciona con las claves de objeto. En JSON (a diferencia de JavaScript), estas DEBEN ser cadenas de comillas dobles. De hecho, TODAS las cadenas en JSON deben estar entre comillas dobles (JavaScript también permite comillas simples, JSON no). ref: http://simonwillison.net/2006/Oct/11/json/ – bsr

1

Véase la respuesta sobre las cotizaciones.

La razón es simple - cuando se tiene este código:

[sometag someattr="qwerty"123":cxzcxz"/]

navegador entiende como:

[sometag someattr="qwerty"/]

y última parte (123 ": cxzcxz") acaba de lanzar fuera como chatarra . Así que para su caso concreto parseJSON trata de trabajar con sólo esto:

[{

Pero creo que `sa cadena completa como:

[{"X":0,"Y":0,"W":0,"H":500},{"X":358,"Y":62,"W":200,"H":500}]

Así que mejor debe codificar su JSON antes de poner en un valor de campo oculto en el lado del servidor.

3

Usted puede hacer algo como esto, pero es bastante malo, HTML:

<textarea id="jsondata" sytle="display:none"></textarea> 

y JS

$(function(){ 

    var myItems = [{"X":0,"Y":0,"W":0,"H":500}, {"X":358,"Y":62,"W":200,"H":500}] 

    $("#jsondata").val(JSON.stringify(myItems)); 

}); 
Cuestiones relacionadas