Рубрики
Без рубрики

Флэк 101: добавление, редактирование и отображение данных

Получите практические, реальные навыки Python на наших ресурсах и пути

Автор оригинала: Mike Driscoll.

В прошлый раз мы узнали, как добавить форму поиска в нашу приложение Music Database. Конечно, мы до сих пор не добавили никаких данных в нашу базу данных, поэтому форма поиска на самом деле не делает большую часть чего-либо, кроме как сообщает нам, что это ничего не нашел. В этом руководстве мы узнаем, как на самом деле добавить данные, отображать результаты поиска и редактировать записи в базе данных.

Давайте начнем!

Добавление данных в базу данных

Давайте начнем с кодирования нашего нового альбома формы. Откройте файл «Formsys», который мы создали в последнем руководстве и добавьте следующий класс:

class AlbumForm(Form):
    media_types = [('Digital', 'Digital'),
                   ('CD', 'CD'),
                   ('Cassette Tape', 'Cassette Tape')
                   ]
    artist = StringField('Artist')
    title = StringField('Title')
    release_date = StringField('Release Date')
    publisher = StringField('Publisher')
    media_type = SelectField('Media', choices=media_types)

Это определяет все поля, которые нам нужно создать новый альбом. Теперь нам нужно открыть «main.py» и добавить функцию для обработки того, что происходит, когда мы хотим создать новый альбом.

# main.py

from app import app
from db_setup import init_db, db_session
from forms import MusicSearchForm, AlbumForm
from flask import flash, render_template, request, redirect
from models import Album

init_db()


@app.route('/', methods=['GET', 'POST'])
def index():
    search = MusicSearchForm(request.form)
    if request.method == 'POST':
        return search_results(search)

    return render_template('index.html', form=search)


@app.route('/results')
def search_results(search):
    results = []
    search_string = search.data['search']

    if search.data['search'] == '':
        qry = db_session.query(Album)
        results = qry.all()

    if not results:
        flash('No results found!')
        return redirect('/')
    else:
        # display results
        return render_template('results.html', table=table)
    
    
@app.route('/new_album', methods=['GET', 'POST'])
def new_album():
    """
    Add a new album
    """
    form = AlbumForm(request.form)
    return render_template('new_album.html', form=form)
    

if __name__ == '__main__':
    app.run()

Здесь мы добавляем импорт для импорта нашей новой формы вверху, а затем мы создаем новую функцию под названием new_album () Отказ Затем мы создаем экземпляр нашей новой формы и передайте его нашим Render_template () Функция, которая сделает файл под названием «new_album.html». Конечно, этот HTML-файл пока не существует, так что это будет следующее, что нам нужно создать. Когда вы сохраняете этот новый HTML-файл, убедитесь, что вы сохраните его в папку «Шаблоны» внутри вашей папки «MusicDB».

Как только у вас создано «new_album.html», добавьте следующий HTML к нему:


New Album - Flask Music Database

New Album

{% from "_formhelpers.html" import render_field %}
{{ render_field(form.artist) }} {{ render_field(form.title) }} {{ render_field(form.release_date) }} {{ render_field(form.publisher) }} {{ render_field(form.media_type) }}

Этот код окажет каждое поле в виде, а также создает кнопку отправки, чтобы мы могли сохранить наши изменения. Последнее, что нам нужно сделать, это обновить наш код «index.html», чтобы у него есть ссылка, которая загрузит наш новый альбом. В основном все, что нам нужно сделать, это добавить следующее:

Так что полное изменение выглядит так:



    Flask Music Database


Flask Music Database

New Album {% with messages = get_flashed_messages() %} {% if messages %}

    {% for message in messages %}
  • {{ message }}
  • {% endfor %}
{% endif %} {% endwith %} {% from "_formhelpers.html" import render_field %}
{{ render_field(form.select) }}

{{ render_field(form.search) }}

Теперь, если вы загрузите главную страницу вашего веб-приложения, он должен выглядеть так:

Если вы нажмете ссылку «Новый альбом», то вы должны увидеть что-то вроде этого в вашем браузере:

Теперь у нас есть уродливая, но функциональная форма нового альбома, но мы на самом деле не сделали Отправить кнопка работа. Это наша следующая рубашка.

Сохранение данных

Нам нужен наш новый альбом, чтобы сохранить данные, когда кнопка отправки нажата. Что происходит, когда вы нажимаете кнопку отправки? Если вы вернетесь к файлу «new_album.html», отметим, что мы устанавливаем Метод формы пост. Поэтому нам нужно обновить код в main.py Так что это делает что-то на посте.

Чтобы сделать сохранение, нам нужно обновить new_album () Функция в main.py Так что это заканчивается так:

@app.route('/new_album', methods=['GET', 'POST'])
def new_album():
    """
    Add a new album
    """
    form = AlbumForm(request.form)

    if request.method == 'POST' and form.validate():
        # save the album
        album = Album()
        save_changes(album, form, new=True)
        flash('Album created successfully!')
        return redirect('/')

    return render_template('new_album.html', form=form)

Теперь, когда мы публикуем, мы создаем экземпляр альбома и передаем его на Save_changes () функция вместе с объектом формы. Мы также проходим вдоль флага, который указывает, является ли элемент новым или нет. Мы перейдем за то, почему я добавил, что последний позже в статье. Насколько сейчас нам нужно создать Save_changes () функция. Сохраните следующий код в main.py скрипт

def save_changes(album, form, new=False):
    """
    Save the changes to the database
    """
    # Get data from form and assign it to the correct attributes
    # of the SQLAlchemy table object
    artist = Artist()
    artist.name = form.artist.data

    album.artist = artist
    album.title = form.title.data
    album.release_date = form.release_date.data
    album.publisher = form.publisher.data
    album.media_type = form.media_type.data

    if new:
        # Add the new album to the database
        db_session.add(album)

    # commit the data to the database
    db_session.commit()

Здесь мы извлекаем данные из формы и назначаем ее атрибутам объекта альбома. Вы также заметите, что нам нужно создать Художник Примечание, чтобы на самом деле правильно добавить художника в альбом. Если вы этого не сделаете, вы получите ошибку, связанную с SQLALCHEMY. Новый параметр используется здесь, чтобы добавить новую запись в базу данных.

Вот сессия, которую я сделал, чтобы проверить это:

Как только элемент сохраняется, он должен вернуть вас на домашнюю страницу сайта. Одно следует отметить, что я не делаю никакой проверки в базе данных, чтобы помешать пользователю сохранить запись несколько раз. Это то, что вы можете добавить себя, если вы хотите, чтобы взять на себя вызов. Во всяком случае, пока я проверял это, я представил одну и ту же запись несколько раз, поэтому, когда я делаю поиск, я должен заканчиваться с несколькими записями для одного и того же элемента. Если вы попробуете выполнить поиск сейчас, хотя вы получите ошибку, потому что мы еще не создали страницу результатов.

Давайте сделаем это следующим!

Отображение результатов поиска

Я предпочитаю, имея табличные результаты, которые требуют с использованием таблицы. Вместо того, чтобы возиться с элементами таблицы HTML, вы можете скачать еще одно расширение колбы, называемое Таблица колба Отказ Чтобы установить его, просто используйте пики, как это:

pip install flask_table

Теперь, когда у нас есть установлена таблица Flask, нам нужно создать определение таблицы. Давайте создадим файл, который мы будем называть «Tables.py» и сохранить его в нашей папке MusicDB. Откройте это в своем редакторе и добавьте следующий код:

from flask_table import Table, Col

class Results(Table):
    id = Col('Id', show=False)
    artist = Col('Artist')
    title = Col('Title')
    release_date = Col('Release Date')
    publisher = Col('Publisher')
    media_type = Col('Media')

Когда вы определяете класс таблицы, вы захотите сделать класс атрибутируют то же имя, что и в объекте, который будет передан ему. В этом случае я использовал атрибуты из класса альбома здесь. Теперь нам просто нужно создать Результаты .html файл и сохранить его к Шаблоны папка. Вот что должно идти в этом файле:


Search Results - Flask Music Database
{{ table }}

Как видите, все, что нам нужно было сделать, было добавить элемент заголовка, который на самом деле необязательно, и добавить объект таблицы в Jinja.

Наконец, нам нужно обновить нашу функцию поиска в наших main.py Использовать таблицу:

@app.route('/results')
def search_results(search):
    results = []
    search_string = search.data['search']

    if search.data['search'] == '':
        qry = db_session.query(Album)
        results = qry.all()

    if not results:
        flash('No results found!')
        return redirect('/')
    else:
        # display results
        table = Results(results)
        table.border = True
        return render_template('results.html', table=table)

Теперь, когда вы запустите поиск с пустой строкой, вы должны увидеть что-то вроде этого:

Да, это довольно просто, но это работает, и теперь вы можете увидеть все в вашей базе данных.

Редактирование данных в базе данных

Последний пункт, который нам нужен, так как редактировать данные в базе данных. Один из самых простых способов сделать это, будет искать элемент и добавить способ для пользователя редактировать элементы, которые были найдены. Откройте файл table.py и добавьте на Linkcol :

from flask_table import Table, Col, LinkCol

class Results(Table):
    id = Col('Id', show=False)
    artist = Col('Artist')
    title = Col('Title')
    release_date = Col('Release Date')
    publisher = Col('Publisher')
    media_type = Col('Media')
    edit = LinkCol('Edit', 'edit', url_kwargs=dict(id='id'))

Linkcol берет имя столбца как строку вместе с той конечной точкой. Конечная точка – это функция, которая будет называться, когда ссылка нажала. Мы также проходим вдоль идентификатора записи, поэтому мы можем посмотреть его в базе данных (то есть аргумент URL_KWARG). Теперь нам нужно обновить наши main.py Файл с функцией под названием Редактировать () :

@app.route('/item/', methods=['GET', 'POST'])
def edit(id):
    qry = db_session.query(Album).filter(
                Album.id==id)
    album = qry.first()

    if album:
        form = AlbumForm(formdata=request.form, obj=album)
        if request.method == 'POST' and form.validate():
            # save edits
            save_changes(album, form)
            flash('Album updated successfully!')
            return redirect('/')
        return render_template('edit_album.html', form=form)
    else:
        return 'Error loading #{id}'.format(id=id)

Первый элемент, который следует принять к сведению, что у нас есть пользовательский маршрут, настроен для URL, который использует идентификатор, который мы передаем ему, чтобы создать уникальный URL. Далее мы выполняем поиск базы данных для идентификатора. Если мы найдем идентификатор, то мы можем создать нашу форму, используя одну и ту же форму, которую мы создали ранее. Однако на этот раз мы передаем это объект альбома, чтобы форма предварительно заполнена данными, поэтому нам есть что-то для редактирования. Если пользователь нажимает кнопку «Отправить на этой странице», она сохранит запись в базу данных и позволит пользователю прошить сообщение для этого эффекта. Если мы пройдем в плохой идентификатор, то сообщение будет отображено пользователю.

Нам также нужно создать edit_album.html Файл в нашем Шаблоны папка. Вот HTML, который вам нужно поставить в этот файл:


Edit Album - Flask Music Database

Edit Album

{% from "_formhelpers.html" import render_field %}
{{ render_field(form.artist) }} {{ render_field(form.title) }} {{ render_field(form.release_date) }} {{ render_field(form.publisher) }} {{ render_field(form.media_type) }}

Теперь, когда мы запустим пустой поиск с ранее, вы должны увидеть это:

Давайте нажмем на ссылку редактирования первой строки:

Здесь я редаю большинство полей на странице. Затем я нажал «Отправить»:

Предположительно, запись была обновлена моими изменениями. Чтобы проверить, попробуйте запустить другой пустой поиск:

Это выглядит правильно, поэтому теперь у нас есть функциональность редактирования!

Обертывание

На этом этапе вы должны быть в состоянии добавить записи в базу данных, отображать все записи и редактировать упомянутые записи. Отсутствует главный пункт, как отфильтровать результаты поиска, чтобы он на самом деле ищет термин поиска, а не всегда возвращать все в базе данных. Мы, вероятно, также должны добавить возможность удалить элемент из базы данных. Это темы, на которых мы рассмотрим в следующей статье. На данный момент повеселиться и счастливого кодирования!

Скачать код

Загрузите Тарбол кода из этой статьи: flak_musicdb_part_iv.tar или клонировать это на Гадость

Другие статьи в серии

  • Часть I – Флэк 101: Начиная
  • Часть II – Флэк 101: Добавление базы данных
  • Часть III – Флэк 101: Как добавить форму поиска