0

Tengo un script que agrega el contenido de una variable a una tabla y crea dinamicamente unos botones que deberian pasarle a una funcion un arreglo. pero este arreglo al tener caracteres especiales o espacios me genera conflicto.

A continuacion el script que genera la tabla con los botones. (Lo importante es la variable array y el llamado a la funcion editarSucursal en el Onclick del boton).

 <script type="text/javascript">

$(document).ready(function(){

  $.ajax({
                    type: 'POST',
                    url: "showStores.php",
                    data:{
                      'id':'helow'
                    },
                    success: function (mensaje) {
                   var data2=    JSON.parse(mensaje);

                        // tablamodificar
              var contenido=" <table class='table ' data-filtering='false' data-sorting='true' id='table2' style='text-align:center; vertical-align: text-top; border: solid; border-width: 1px; border-radius: 0;border-color: black;'>";
                                contenido+="<thead style='background: #064380;  color: white;'>";
                                contenido+="<tr>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Nombre</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Nombre Completo</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Tipo de Documento</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Numero de Documento</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Email</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Dirección</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Altura</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Piso</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>N° de telefono</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Codigo postal</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Ciudad </th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Provincia</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Acción</th>";
                                contenido+="</tr>";
                                contenido+="</thead>";
                                contenido+="<tbody>";
            for (let index = 0; index < data2.length; index++) {
              contenido+="<tr>";
              contenido+="<td>"+data2[index].short_name+"</td>";
              contenido+="<td>"+data2[index].name+"</td>";
              contenido+="<td>"+data2[index].doc_type+"</td>";
              contenido+="<td>"+data2[index].doc_number+"</td>";
              contenido+="<td>"+data2[index].email+"</td>";
              contenido+="<td>"+data2[index].address+"</td>";
              contenido+="<td>"+data2[index].stree_number+"</td>";
              contenido+="<td>"+data2[index].floor+"</td>";
              contenido+="<td>"+data2[index].phone+"</td>";
              contenido+="<td>"+data2[index].zip_code+"</td>";
              contenido+="<td>"+data2[index].city+"</td>";
              contenido+="<td>"+data2[index].state+"</td>";
              var array = new Array(data2[index].short_name,data2[index].name,data2[index].doc_type,data2[index].doc_number,(data2[index].email),data2[index].address,data2[index].floor,data2[index].phone,data2[index].zip_code,data2[index].city,data2[index].state);
              // console.log(array);
              contenido+="<td> <button type='button' onclick='editarSucursal("+array+");' class='btn btn-sm btn-primary' style='color:#CBA92A    ;' href='#'  ><i class='fas fa-pencil-alt'></i></button> <button type='button'  class='btn btn-sm btn-primary' style='color:red;' href='#'  ><i class='fa fa-times'></i></button> </td>";




              contenido+="</tr>";

            }
              contenido+="</tbody>";
                                contenido+="</table>";

              $('#tablaStores').html(contenido);    


                  }
     });
 });    

Aca el script de la funcion que por ahora no hace nada pero deberia recibir el array

  function editarSucursal(data){ //por ahora no hace nada}

Y por ultimo el error que recibo en el navegador

introducir la descripción de la imagen aquí

10
  • Hola @Augusto Vidal, por lo que veo , no has cerrado la llave del for. Commented el 15 mar. 2019 a las 12:49
  • hola @SebastiánLagosYañez , gracias por tu respuesta, no copie todo pero si la cierro justo despues de eso, el for lamentablemente no es el problema. Commented el 15 mar. 2019 a las 12:51
  • Para tener en cuenta el llamas dos veces a editarSucursal; una con el array y otra lo mandas vació. Pero el erro si es por un ')' que no esta cerrada. Commented el 15 mar. 2019 a las 12:59
  • Hola Augusto. Si usas "\" al final de cada linea, puedes hacer un string multi linea y no tener que concatenar tantos +=. recuerda que tambien existen las plantillas de literales. Un saludo!
    – lois6b
    Commented el 15 mar. 2019 a las 13:01
  • sisi gracias , pero son dos botones diferentes (el que no recibia el array no lo apretaba). De todos modos lo borre para no tener conflicto pero sigo con el mismo problema. Commented el 15 mar. 2019 a las 13:03

1 respuesta 1

2

Estás creando mal el array.

    var array = new Array(data2[index].short_name,data2[index].name,data2[index].doc_type,data2[index].doc_number,(data2[index].email),data2[index].address,data2[index].floor,data2[index].phone,data2[index].zip_code,data2[index].city,data2[index].state);

Tienes que escapar el código al html y recién allí colocarle el onclick='editarSucursal

Prueba este ejemplo y dime como te fue ejemplo:.

 $(document).ready(function(){
  $.ajax({
                    type: 'POST',
                    url: "showStores.php",
                    data:{
                      'id':'helow'
                    },
                    success: function (mensaje) {
                   var data2=    JSON.parse(mensaje);

                        // tablamodificar
              var contenido=" <table class='table ' data-filtering='false' data-sorting='true' id='table2' style='text-align:center; vertical-align: text-top; border: solid; border-width: 1px; border-radius: 0;border-color: black;'>";
                                contenido+="<thead style='background: #064380;  color: white;'>";
                                contenido+="<tr>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Nombre</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Nombre Completo</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Tipo de Documento</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Numero de Documento</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Email</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Dirección</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Altura</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Piso</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>N° de telefono</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Codigo postal</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Ciudad </th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Provincia</th>";
                                contenido+="<th data-breakpoints='' style='color: white;'>Acción</th>";
                                contenido+="</tr>";
                                contenido+="</thead>";
                                contenido+="<tbody>";
            for (let index = 0; index < data2.length; index++) {
              contenido+="<tr id=\"tr_"+index+"\">";
              contenido+="<td>"+data2[index].short_name+"</td>";
              contenido+="<td>"+data2[index].name+"</td>";
              contenido+="<td>"+data2[index].doc_type+"</td>";
              contenido+="<td>"+data2[index].doc_number+"</td>";
              contenido+="<td>"+data2[index].email+"</td>";
              contenido+="<td>"+data2[index].address+"</td>";
              contenido+="<td>"+data2[index].stree_number+"</td>";
              contenido+="<td>"+data2[index].floor+"</td>";
              contenido+="<td>"+data2[index].phone+"</td>";
              contenido+="<td>"+data2[index].zip_code+"</td>";
              contenido+="<td>"+data2[index].city+"</td>";
              contenido+="<td>"+data2[index].state+"</td>";
              // console.log(array);
              contenido+="<td > <button id=\"editarSucursal_"+index+"\" type='button' class='btn btn-sm btn-primary' style='color:#CBA92A    ;' href='#'  ><i class='fas fa-pencil-alt'></i></button> <button type='button'  class='btn btn-sm btn-primary' style='color:red;' href='#'  ><i class='fa fa-times'></i></button> </td>";
              contenido+="</tr>";

            }
              contenido+="</tbody>";
              contenido+="</table>";

              $('#tablaStores').html(contenido);    

            for (let index = 0; index < data2.length; index++) {            
                var array = new Array(data2[index].short_name,data2[index].name,data2[index].doc_type,data2[index].doc_number,(data2[index].email),data2[index].address,data2[index].floor,data2[index].phone,data2[index].zip_code,data2[index].city,data2[index].state);
            $("#editarSucursal_"+index).attr('onclick','editarSucursal('+array+')');

            }



                  }
     });
 }); 

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.