0

Estoy recibiendo data desde un API de peliculas para hacer un WatchList. Estoy renderizando la data de la API a HTML con Bootstrap dependiendo del "user input"

Este es el codigo:

let displayMovies;
      $.each(results, (index, {title, poster_path, release_date }) => {
        displayMovies += `
          <div class="col-md-3"> 
          <div class="well text-center">
          <img src="https://image.tmdb.org/t/p/original${poster_path}"></a>
            <h5>${title}</h5>
            <h4>${release_date}<h4>
            <button class="btn btn-primary" id="add-button" type="button">Add to watchlist</button>
          </div>
        </div>
          `;
      });

      $("#movies").html(displayMovies);

Como podria seleccionar la pelicula y mandar su informacion(title, poster_path, release_date) al localStorage al presionar el boton "AddtoWatchList"?

1 respuesta 1

0

Puedes utilizar el evento on click del id add-button de tu botón, en el ejemplo que comparto, utilizo un objeto, puedes o no utilizarlo de esa forma según tu requerimiento.

// Al hacer clic en un botón "Add to watchlist", agrega la información de la película al localStorage
$("#movies").on("click", "#add-button", (event) => {
  // Obtiene la información de la película del elemento HTML que contiene el botón
  const movieElement = $(event.target).closest(".well");
  const title = movieElement.find("h5").text();
  const posterPath = movieElement.find("img").attr("src");
  const releaseDate = movieElement.find("h4").text();
  
  // Crea un objeto que contenga la información de la película
  const movie = {
    title: title,
    posterPath: posterPath,
    releaseDate: releaseDate
  };
  
  // Agrega el objeto de la película al localStorage
  localStorage.setItem("movie", JSON.stringify(movie));
});

$("#movies").html(displayMovies);

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

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