I can not use a Json file

Question

I can not use a Json file

Navigation

#1 by (1 votes)
#2 by (1 votes)

0

What happens is that I'm trying to use this Json to locate on the map and show the information:

[
  {
    "codigo": 0,
    "sucursal": "PUERTA DEL NORTE MEDELLIN (Centro Comercial)",
    "region": "ANTIOQUIA",
    "direccion": "Diagonal 55 #34-67, Bello (Antioquia).",
    "ciudad": "MEDELLIN",
    "lunes": "11:00 -  20:00",
    "martes": "11:00 -  20:00",
    "miercoles": "11:00 -  20:00",
    "jueves": "11:00 - 20:00",
    "viernes": "11:00 - 21:00",
    "sabado": "11:00 - 21:00",
    "domingosFestivos": "12:00 - 8:00",
    "latitud":"6.3394457",
    "longitud":"-75.5457144"
  }
]

Through this Js:

function addEventCoord(event) {
  event.preventDefault();
  code = jQuery(this).data('code');
  $.get('./tiendas.json', function(result) {
    $.each(result, function (i, item) {
      if(code === item.codigo){
         sabado = item.sabado;
         domingosFestivos = item.domingosFestivos;
         latlng = new google.maps.LatLng(item.latitud, item.longitud);
         map.setCenter(latlng);
         map.setZoom(18);

         var msg = '<div class="infoBox">';
         msg  =  msg + '<h3>'+ item.sucursal +'</h3>';
         msg  =  msg + '<p>'+ item.direccion +'</p>';
         msg  =  msg + '<div id="bodyContent">';
         msg  =  msg + '<h3>Horario regular</h3>';
         msg  =  msg + '<p>Lunes:'+ item.lunes +'<br/>';
         msg  =  msg + 'Martes:'+ item.martes +'<br/>';
         msg  =  msg + 'Miercoles:'+ item.miercoles +'<br/>';
         msg  =  msg + 'Jueves:'+ item.jueves +'<br/>';
         if (sabado != '' && domingosFestivos == ''){
           msg  =  msg + 'Viernes:'+ item.viernes +'<br/>';
           msg  =  msg + 'Sábado:'+ sabado +'</p>';
         } else if(sabado == '' && domingosFestivos != '') {
           msg  =  msg + 'Viernes:'+ item.viernes +'<br/>';
           msg  = msg + 'domingos y festivos:'+item.domingosFestivos+'</p>';
         } else if(sabado != '' && domingosFestivos != '') {
           msg  =  msg + 'Viernes:'+ item.viernes +'<br/>';
           msg  =  msg + 'Sábado:'+ sabado +'<br/>';
           msg  = msg + 'Domingos y Festivos:'+item.domingosFestivos+'</p>';
         }else{
           msg  =  msg + 'Viernes:'+ item.viernes +'</p>';
         }
         msg  =  msg + '</div>';
         msg  =  msg + '</div>';

       }
     });
   });
 }
 function showStores(city){
   $.get('./tiendas.json', function(result) {
     $.each(result, function (i, item) {
       sabado = item.sabado;
       domingosFestivos = item.domingosFestivos;
       latLng = new google.maps.LatLng(item.latitud, item.longitud);
       var marker = new google.maps.Marker({
         position: latLng,
         map: map,
         icon: imgMarker
       });

       var msg = '<div class="infoBox">';
       msg  =  msg + '<h3>'+ item.sucursal +'</h3>';
       msg  =  msg + '<p>'+ item.direccion +'</p>';
       msg  =  msg + '<div id="bodyContent">';
       msg  =  msg + '<h3>Horario regular</h3>';
       msg  =  msg + '<p>Lunes:'+ item.lunes +'<br/>';
       msg  =  msg + 'Martes:'+ item.martes +'<br/>';
       msg  =  msg + 'Miercoles:'+ item.miercoles +'<br/>';
       msg  =  msg + 'Jueves:'+ item.jueves +'<br/>';
       if (sabado != '' && domingosFestivos == ''){
         msg  =  msg + 'Viernes:'+ item.viernes +'<br/>';
         msg  =  msg + 'Sábado:'+ sabado +'</p>';
       } else if(sabado == '' && domingosFestivos != '') {
         msg  =  msg + 'Viernes:'+ item.viernes +'<br/>';
         msg  = msg + 'domingos y festivos:'+item.domingosFestivos+'</p>';
        } else if(sabado != '' && domingosFestivos != '') {
          msg  =  msg + 'Viernes:'+ item.viernes +'<br/>';
          msg  =  msg + 'Sábado:'+ sabado +'<br/>';
          msg  = msg + 'Domingos y Festivos:'+item.domingosFestivos+'</p>';
        }else{
          msg  =  msg + 'Viernes:'+ item.viernes +'</p>';
        }
        msg  =  msg + '</div>';
        msg  =  msg + '</div>';

        attachMessage(marker,msg);

        if(city == 'armenia colombia'){
          city = 'armenia';
        }else if(city == 'chia colombia'){
          city = 'chia';
        }else if(city == 'rionegro colombia'){
          city = 'rionegro';
        }

        if(item.ciudad.toLowerCase() == city){
          var html = getEmbedHTML(item.sucursal,item.direccion,item.codigo, item.lunes, item.martes, item.miercoles, item.jueves, item.viernes, sabado, domingosFestivos);
          $(".storeResult").append(html);
        }else if(city == ''){
          var html = getEmbedHTML(item.sucursal,item.direccion,item.codigo, item.lunes, item.martes, item.miercoles, item.jueves, item.viernes, sabado, domingosFestivos);
          $(".storeResult").append(html);
        }

      });
    });
    setTimeout(function() {
      $('a#anchor').on("click", addEventCoord);
    }, 2000);
}

But in the browser console I'm getting this error and I can not solve it:

javascript jquery html json

asked by Jhojan Guerrero 14.09.2018 в 16:05

source

2 answers

1

I'll give you a couple of tips. 1 when you upload a file using jquery to load a json try to tell jquery that the answer is of type json.

$.ajax({
    url: "/login.",
    method: "GET",
dataType: "json",
    data: {
        email: email,
        msg: Alg.encript(mO.lKey, password)
    },
    success: function (data, status) {
        var result =data;

    }
});

otherwise you must convert the text to JSON when you receive it

$.ajax({
    url: "/login.",
    method: "GET",
    data: {
        email: email,
        msg: Alg.encript(mO.lKey, password)
    },
    success: function (data, status) {
        var result = JSON.parse(data);

    }
});

2- I would not recommend you to use $. each (result, function (i, item) { to iterate the result it is more efficient to use the JS methods like:

for (var i in result) { and refer to each item as result [i] this will make your code easier to debug and eliminate the asicronia derived from using $ .each,

3 $ .each is useful, very useful, if you are working with html elements:

$("p").each(function (i, item) {
$(item).hide();
}

but not so much for the data in your case an array of objects

answered by 14.09.2018 в 18:52

how to execute functions in the constructor of a class js Help with database structure

score 1 · Accepted Answer

You have two options, or pass one more parameter to $.get() or change the method to $.getJSON() . For example:

// le paso un parámetro más para declarar que es un json
$.get('./tiendas.json', function(result) {
  ...
}, 'json');

// también podés hacerlo con el $.getJSON();
$.getJSON('./tiendas.json', function(result) {
  ...
});