0

Here's the function that gets data from the api and passes it to the results template:

@auth.route('/search', methods=['GET', 'POST'])
def search():
        query = request.form['title']
        url = 'http://www.omdbapi.com/?apikey=API_KEY&s={0}'.format(query)
        response = requests.get(url)
        res = response.json()
        return render_template("results.html", user=current_user, data=res)

Then I iterate through the data and render each result in its own card component, along with a favourite button for each one:

  {% for datas in data['Search'] %}
  <div class="card row align-items-center" style="width: 20rem">
    <img style="height: 150px; width: 150px;"class="card-img-top img-thumbnail"
    src={{datas['Poster']}} alt="Card image cap">
    <div class="card-body">
      <h5 style="text-align: center" class="card-title">{{datas['Title']}}</h5>
    </div>
    <ul class="list-group list-group-flush">
      <li style="text-align: center" class="list-group-item">
        Year: {{datas['Year']}}
      </li>
      <li style="text-align: center" class="list-group-item">
        IMDb ID: {{datas['imdbID']}}
      </li>
    </ul>
    <div class="card-body">
      <form method="POST">
        <button type="submit" class="btn btn-primary" role="button">
          Add to favourites
        </button>
      </form>
    </div>
  </div>
  {% endfor %}

The trouble I'm having is figuring out how to pass the data from each result to a method using the favourite button and then saving that data to the database as a favourited movie. My initial thought was if there could be a way to automatically put it in a form input and then get the data easily from request.form, which is why I wrapped the form tag around the button. Anyone know how to do this?

struggler
  • 15
  • 5

1 Answers1

0

Using form tag would result in a page reload. You can use a little javascript like ajax to send the request asynchronously.

You can refer to this answer

Akash Unni
  • 406
  • 2
  • 7