Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

201
Vistas
storing Api JSON Data into localstorage js

I'm trying to save Api JSON Data into local-storage js,but still when I reload the page all data I'm trying to save in local-storage disappear.

Here is the code:

const mealList = document.getElementById("meal");
mealList.addEventListener("click", getMealRecipe);

function getMealList() {
    let searchInputText = document.getElementById("search-input").value.trim();

    fetch(`https://www.themealdb.com/api/json/v1/1/filter.php?i=${searchInputText}`)


    .then(response => response.json())
        .then(data => {
            let html = "";
            localStorage.setItem("proInCart", JSON.stringify(data.meals));
            let prog = JSON.parse(localStorage.getItem("proInCart"));

          

            if (data.meals) {
                
                data.meals.forEach(meal => {
                    html += `<div class="meal-item" data-id="${meal.idMeal}">
                     <div class="meal-img">
                     <img src="${meal.strMealThumb}" alt="">
                    </div>
                    <div class="meal-name">
                     <h3>${meal.strMeal}</h3>
                    <a href="#" class="recipe-btn">Get Recipe</a>
                    </div>
                    </div>`
                })

                mealList.classList.remove("notFound");
            } else {
                if (localStorage.getItem("sorry")) { html = localStorage.getItem("sorry") } else {
                    localStorage.setItem("sorry", "sorry,We didnt find any meal!");
                    let sorry = localStorage.getItem("sorry");
                    html = localStorage.getItem("sorry");
                }


                mealList.classList.add("notFound");
            }
            let progg = JSON.parse(localStorage.getItem("proInCart"));
            if (localStorage.getItem("html")) { mealList.innerHTML = localStorage.getItem("html") } else {
                localStorage.setItem("html", html);
                let hhtml = localStorage.getItem("html");
                mealList.innerHTML = localStorage.getItem("html");
            }
            mealList.innerHTML = html;

        });
}
about 4 years ago · Juan Pablo Isaza
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda