Home / Questions / 20366
Accepted
Alan
Asked: 2020-08-13 06:34:13 +0800 CST 2020-08-13 06:34:13 +0800 CST

Error sending a JSON.stringify via an onclick event in javaScript

  • 772

I want to send an associative array through an event onclick, when I send it, when I capture it, it appears, [object object]so I try to send it stringusing type JSON.stringify(), I do it in the following way:

onclick event

$('#div').html('<div class="col-xs-6 text-center"><a href="#" class="on-primary edit-row" onclick=\' mostrarDatos("'+JSON.stringify(datos)+'"); \'><i class="fa fa-pencil" aria-hidden="true"></i></a></div>');

This is how it shows when I capture the error in the console

mostrarDatos("[{"id":"1","nombre":"Prueba","direccion":"calle 2 av Siemprevivas","telefono":"123332123","observaciones":"Asdasdasdasdas","correo":"[email protected]","fechaInicio":"2016-07-01","fechaFin":"2017-02-08","logo":"archivos/mpg.jpg","costo":"9","estado":"1","Municipio_id":"1259","Estado_id":"777","Empresa_id":"2","municipio":"Cali"}]");

This is the error that shows me in the console mistake

javascript

1 Answers

  1. Best Answer

    The error is that you are putting double quotes inside a string delimited with double quotes, so that causes the string to break and give errors. You can see what's wrong even in the coloring that StackOverflow gives to the code:

    mostrarDatos("[{"id":"1","nombre":"Prueba","direccion":"calle 2 av Siemprevivas","telefono":"123332123","observaciones":"Asdasdasdasdas","correo":"[email protected]","fechaInicio":"2016-07-01","fechaFin":"2017-02-08","logo":"archivos/mpg.jpg","costo":"9","estado":"1","Municipio_id":"1259","Estado_id":"777","Empresa_id":"2","municipio":"Cali"}]");

    An easy method would be to change the outside double quote to a single one. Then everything will work fine (and it colors well):

    mostrarDatos('[{"id":"1","nombre":"Prueba","direccion":"calle 2 av Siemprevivas","telefono":"123332123","observaciones":"Asdasdasdasdas","correo":"[email protected]","fechaInicio":"2016-07-01","fechaFin":"2017-02-08","logo":"archivos/mpg.jpg","costo":"9","estado":"1","Municipio_id":"1259","Estado_id":"777","Empresa_id":"2","municipio":"Cali"}]');

    But that would require changing the original string a lot. It's easier to escape the quotes in the result of cJSON.stringify like this:

    JSON.stringify(datos).replace(/\"/g,"&quot;")

    Here is a simplified example that works using that method:

    function mostrarDatos(a) { alert(JSON.stringify(a))}

datos = [{"id":"1","nombre":"Prueba"}];
$('#div').html('<div class="col-xs-6 text-center"><a href="#" class="on-primary edit-row" onclick=\' mostrarDatos('+JSON.stringify(datos).replace(/\"/g,"&quot;")+'); \'><i class="fa fa-pencil" aria-hidden="true"></i>AAAA</a></div>');
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="div">
</div>

    • 1