Цикл для отображения всей информации в html-карточках

Я пытаюсь создать веб-сайт фляги, который будет отображать определенный объем информации в зависимости от результатов. Мне удалось получить данные из базы данных, и я знаю, как отобразить их на 1 html-карте, но я не могу найти способ отобразить всю информацию на основе длины массива, который я передаю. это результат на данный момент [веб-сайт] [1] [1]: https://i.stack.imgur.com/ycqwt.png

{% extends "base.html" %}
{% block title %} Search {% endblock %}
{% block style %}{% endblock %}
{% block body %}

<h1 align = "center">Resluts</h1>
<div class = "card" id = "element1">
<img src = {{url_for('static', filename='pictures/uni.jpg')}} alt = "Avatar" style = "width:20%">
<div class = "container">
<h4><b>Name: {{ name }}</b></h4>
<p>Country: {{ country }}</p>
<p>Major: {{ major }}</p>
<p>Slect and visit: {{ link }}</p>

</div>
<div class = "card">
<img src = {{url_for('static', filename='pictures/uni.jpg')}} alt = "Avatar" style = "width:20%">
<div class = "container">
<h4><b>Name: {{ name }}</b></h4>
<p>Country: {{ country }}</p>
<p>Major: {{ major }}</p>
<p>Slect and visit: {{ link }}</p>

</div>


<p>Here is my variable: {{ text1 }}</p>


{% endblock %}

что я тоже пробовал

<!DOCTYPE html>
<html>
<body>

<div class = "card" id = "div1">
<img src = {{url_for('static', filename='pictures/uni.jpg')}} alt = "Avatar" style = "width:20%">
<div class = "container">
<h4><b>Name: {{ name }}</b></h4>
<p>Country: {{ country }}</p>
<p>Major: {{ major }}</p>
<p>Slect and visit: {{ link }}</p>

</div>
<button onclick = "body()">Try it</button>
<script>
var body = document.getElementsByTagName('body')[2],
newdiv = document.createElement('container');   
                 //add an id
body.appendChild(newdiv);                 

 }
</script>

</body>
</html>

Я хочу передать массив результатов, длину и волшебство, которое должно произойти оттуда это @ app.route ("/ search", methods = ["POST", "GET"]) в app.py

        if request.method == "POST":
            major = request.form["major"]
            country = request.form["country"]
            price = request.form["price"]
            global universities
            universities = search_universities(country, major, price)
            print(universities)
            if universities != []:
                #for x in universities:
                #   name = x[0]
                #   country = x[1]
                #   major = x[2]
                #   price = x[3]
                #   link = x[4]
                list_length = len(universities)
                return render_template('result.html', text1 = universities, list_length = list_length)
            else:
                return render_template('result.html')
        return render_template('search.html')

javascript python html flask

09.04.2021 23:30

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Ответы 1

Данные, которые вы отправляете, имеют форму массива text1. Таким образом, вам не нужно каждый раз повторно отображать один и тот же шаблон, вам просто нужно пройти через него и установить значения соответственно.

Например, это должно выглядеть так:

{% for text in text1 %}
        <h4><b>Name: {{ text[0] }}</b></h4>
        <p>Country: {{ text[1]}}</p>
        <p>Major: {{ text[2] }}</p>
{% endfor %}

Используйте это для справки (text1 - это ваши данные, которые передаются):

<h1 align = "center">Resluts</h1>
<div class = "card" id = "element1">
<img src = {{url_for('static', filename='pictures/uni.jpg')}} alt = "Avatar" style = "width:20%">
<div class = "container">
    {% for text in text1 %}
        <h4><b>Name: {{ text[0] }}</b></h4>
        <p>Country: {{ text[1]}}</p>
        <p>Major: {{ text[2] }}</p>
    {% endfor %}
</div>

Надеюсь, что это работает для вас. Дайте мне знать, если у вас возникнут еще какие-либо сомнения.

09.04.2021 23:52

Другие вопросы по теме

Модуль notify2 не работает при запуске python3 от имени пользователя root

Почему в Python переменная, указанная внутри цикла, имеет длину 1, тогда как другая переменная вне цикла имеет исходную длину?

Как добавить эти входные данные в список, чтобы я мог вызывать их для отображения позже в Python?

Получение файла, отправленного через последовательный порт (linux)

Обработка раскрывающегося списка JIRA None при сравнении значения столбца фрейма данных

Принудительный ввод в Python

Python - загрузка PDF-файлов со страницы ASPX

Есть ли способ отсортировать список координат кривой, чтобы получить конечные точки?

Проблема с областью динамической прокрутки

Проверьте, существует ли значение по индексу в массиве numpy

Цикл для отображения всей информации в html-карточках

Ответы 1

Другие вопросы по теме

Похожие вопросы