I need help with "Adopt a Pet" exercise from Introduction to Flask

Hello fellow learners, and cohorts I hope you are having a great day. I am currently trying to solve the
Adopt a Pet project from my skill path : Web apps with Flask.
Within that project, there is a step with following instructions:

Inside the animals() function, you’ll be modifying html to display the names of all available pets that are of pet_type.

Right before the return statement, create a for loop that iterates over each element in the list of pets. You can access the appropriate list of pets in the pets dictionary by the key, pet_type. Inside the loop, create a <li> element for each pet’s name and concatenate the string to html.

Then, make sure to concatenate the opening <ul> tag to html before the loop and the closing </ul> tag after the loop, such that the <li> elements would be nested inside the <ul> element.

If you run your code and navigate to each animal page, you can see a bulleted list of available pets!

And Here is my code so far…

from flask import Flask from helper import pets app = Flask(__name__) @app.route("/") def index(): return """ <h1>Adopt a Pet!</h1> <p>Browse through the links below to find your new furry friend:</p> <ul> <li><a href = '/animals/dogs'>Dogs</a></li> <li><a href = '/animals/cats'>Cats</a></li> <li><a href = '/animals/rabbits'>Rabbits</a></li> </ul> """ @app.route("/animals/<pet_type>") def animals(pet_type): html = f"<h1>List of {pet_type}</h1>" for pet in pets[pet_type]: return f""" <ul> <li>{pet["name"]}</li> </ul> """

It is expected to have a unordered bullet list of names of pet from each category but instead I am getting only one name printed instead of three.

I would be grateful if someone could help me because I am stuck.

A return statement will exit a function once it has been executed. If you nest it inside a for loop or similar iteration then you will likely exit your function much earlier than you expect (you’ll likely only ever see part of the first iteration).

Double check the ordering in the instructions which mentions where the <ul> tags should be used and the fact that concatenation is mentioned. You want to be creating your string and then returning it.

Here is my complete project, hope this helps :slight_smile:

from flask import Flask from helper import pets app = Flask(__name__) @app.route('/') def index(): return ''' <h1>Adopt a Pet!</h1> <p>Browse through the links below to find your new furry friend:</p> <ul> <li><a href="/animals/dogs">Dogs</a></li> <li><a href="/animals/cats">Cats</a></li> <li><a href="/animals/rabbits">Rabbits</a></li> </ul> ''' @app.route('/animals/<pet_type>') def animals(pet_type): html = f"<h1>List of {pet_type}</h1>" html += '<ul>' for i, item in enumerate(pets[pet_type]): html += f'<li><a href="/animals/{pet_type}/{i}">' + item["name"] +'</a></li>' html += '</ul>' return html @app.route('/animals/<pet_type>/<int:pet_id>') def pet(pet_type, pet_id): pet = pets[pet_type][pet_id] return f''' <h1> {pet["name"]} </h1> <img src="{pet["url"]}"/> <p>{pet['description']}</p> <ul> <li>breed: {pet['breed']}</li> <li>age: {pet['age']}</li> </ul> '''
2 Likes

What worked to me in this specific step:

from flask import Flask from helper import pets app = Flask(__name__) @app.route("/") def index(): return """ <h1>Adopt a Pet!</h1> <p>Browse through the links below to find your new furry friend:</p> <ul> <li><a href="/animals/dogs">Dogs</a></li> <li><a href="/animals/cats">Cats</a></li> <li><a href="/animals/rabbits">Rabbits</a></li> </ul> """ @app.route("/animals/<pet_type>") def animals(pet_type): html = f"<h1>List of {pet_type}</h1>" html += "<ul>" for pet in pets[pet_type]: html += "<li>"+pet["name"]+"</li>" html += "</ul>" return html

It’s a bit tricky accessing the right keys in the pets dictionary, but you want to enter each key by the pet_type and then iterate into the list of pets for each pet type. Then you’ll enter the key ‘name’ to retrieve each pet name into de bullet list.

2 Likes

This is how you can do it so far.

from flask import Flask from helper import pets app = Flask(__name__) @app.route("/") def index(): return """ <h1>Adopt a Pet!</h1> <p>Browse through the links below to find your new furry friend:</p> <ul> <li><a href = '/animals/dogs'>Dogs</a></li>

All you have to do is to add more links according to your code, no?

Hiya! I think you’re stuck on the dictionary syntax, specifically. If that’s the case, hop down (this is my whole project) to where I’ve noted #DICTIONARY ISSUE and check out the for-loop there. You’d want to strip out the “index, pet” and corresponding “enumerate()” function, and just take the href out of the li tag. You’d be left with the for-loop: for pet in pets[pet_type]…{pet[‘name’]}, which I think is what you’re stuck trying to work out. I got stuck there, too. You’re saying, for each element in pets at pet_type, give me the element’s value for key ‘name’.

from flask import Flask from helper import pets app = Flask(__name__) @app.route('/') def index(): return ''' <h1>Adopt a Pet!</h1> <p>Browse through the links below to find your new furry friend:</p> <ul> <li>removed</li> <li>removed</li> <li>removed</li> </ul> ''' #DICTIONARY ISSUE [removed decorator] def animals(pet_type): html = f''' <h1>List of {pet_type}</h1> ''' for index, pet in enumerate(pets[pet_type]): html += f''' <ul> <li><a href="/animals/{pet_type}/{index}">{pet['name']}</li> </ul> ''' return html [removed decorator] def pet(pet_type, pet_id): pet = pets[pet_type][pet_id] return f''' <h1>This pet is: {pet['name']}</h1> <img src="{pet['url']}"/> <p>Description: {pet['description']}</p> <ul> <li>Breed: {pet['breed']}</li> <li>Age: {pet['age']}</li> </ul> '''