entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

2votos

Eliminar item json de localstorage

Hola, tengo almacenado en el localStorage un JSON asi:

"[{"id":"2596","username":"[...]","iduser":"[...]","textmsm":"[...]","imgr":"[...]","locat":{"latitude":null,"longitud":null},"fecha":"[...]","me":"[...]","stick":"[...]","tableid":"[...]"},{"id":"2596","username":"[...]","iduser":"[...]","textmsm":"[...]","imgr":"[...]","locat":{"latitude":null,"longitud":null},"fecha":"[...]","me":"[...]","stick":"[...]","tableid":"[...]"}, [...]
]"

Lo que quiero hacer es una función para eliminar los items mediante el id, por ejemplo si hago deleteitemJSON('2596') que se elimine {"id":"2596","username":"[...]","iduser":"[...]","textmsm":"[...]","imgr":"[...]","locat":{"latitude":null,"longitud":null},"fecha":"[...]","me":"[...]","stick":"[...]","tableid":"[...]"}
Como puedo hacerlo?

1 Respuesta

1voto

Leonardo-Tadei Puntos227320

Hola jaumesv,

lo más cómodo para hacer esto es cargar el JSON a una variable, manipular el array que contiene para borrar el elemento en cuestión (en ese ejemplo el 2596) y luego volver a guardar el JSON entero en el LocalStorage, reemplazando el que estaba antes de iniciar el proceso.

Si me permitís, te sugeriría que no uses el LocalStorage de esta manera, ya que si los datos con muchos consumirá mucha RAM y hará que la página se vea lenta. Almacená en cambio en el LocalStorage cada dato por separado usando como clave el ID, de manera tal de poder acceder y borrar cada registro por separado. Como dato del registro, mantené la misma estructura del JSON actual, incluyendo el ID para poder seguir reusando tu código actual de acceso a los datos sin cambios.

Saludos!

0voto

Jaumesv comentado

Y como sería eso? Porque he probado asi pero me da error:

function findAndRemove(array, property, value) {
       $.each(array, function(index, result) {
          if(result[property] == value) {
              //Remove from array
              array.splice(index, 1);
          }    
       });
    }
    findAndRemove(localStorage.getItem('c2'), 'id', '2596');

0voto

Leonardo-Tadei comentado

Y qué error te da?

De todas formas, esta función borraría el elemento que se obtiene con getItem(), pero si no veo mal, no lo guarda de nuevo en el LocalStorage, por lo que seguiría ahí para próximas lecturas.

Esto es un ejemplo de cómo borrar un elemento de una vector en JavaScript Vanilla:

var array_numeros = [4,5,6];
var idx = array_numeros.indexOf(5); // Localizamos el indice del elemento en array
if(idx!=-1) array_numeros.splice(idx, 1); // Lo borramos definitivamente

A veces es más fácil no usar bibliotecas...

0voto

Jaumesv comentado

Aaa, lo saque de aqui: http://stackoverflow.com/questions/6310623/remove-item-from-json-array-using-its-name-value y creía que me funcionaria pero me daba error y tampoco pense que no iba a volverlo a guardarlo en el localStorage. Al final lo he conseguido asi:

tabledf = JSON.parse(localStorage.getItem('c'+tableid));
       Array.prototype.removeValue = function(name, value){
         var array = $.map(this, function(v,i){
           return v[name] === value ? null : v;
         });
       this.length = 0; //clear original array
       this.push.apply(this, array); //push all elements except the one we want to delete
       }
       tabledf.removeValue('id',id);
       localStorage.setItem('c'+tableid, JSON.stringify(tabledf));

0voto

Leonardo-Tadei comentado

Gracias por compartir tu solución!

Me queda la duda de la eficiencia, ya que agregar un método a la clase vía prototype y usar $.map de JQuery debe ser extremadamente más lento que llamar directamente a splice() del array.

Tomá nota por si alguna vez hay que optimizar el código. Miestras tanto dejalo así, pero no es una buena práctica la optimización prematura.

Saludos!

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta