Я создаю веб-сайт, который позволяет администратору писать в пунктах меню, переупорядочивать их, перетаскивая их на страницу администратора, сериализовывать их и размещать на главной странице, на которую попадают клиенты.Я довольно новичок в некоторых аспектах этого, так что терпите меня, когда я пытаюсь объяснить.Заранее спасибо.
Большая проблема в index.html заключается в том, что я не знаю jquery, и на данный момент я не понимаю, как связать его с sqlalchemy.jquery, который я имею ниже, является чем-то, что я «присвоил» из другого вопроса stackoverflow, тот, который не ответил на мой вопрос полностью.Я думаю, что AJAX, скорее всего, нужно изменить
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<!-- sortable script -->
<script>
$(function() {
$( "#sortable" ).sortable({
update: function(event, ui) {
var postData = $(this).sortable('serialize');
$.ajax({
type: 'POST',
contentType: 'application/json',
data: JSON.stringify(postData),
dataType: 'json',
url: '/post'
});
}
});
});
</script>
</head>
<body>
<div class="container">
<h1>Admin Page</h1>
<!-- FORM (I have left this out for clarity) -->
<!-- MENU ITEMS -->
<div class="container menu">
<ul id="sortable">
{% for item in items %}
<li class="nobull" id="item_{{ item.id }}">
<div class="menu_item">
{% if item.head == True %}
<div class="menu_heading">
{{ item.name }}
</div>
{% else %}
<div class="menu_item_name">
{{ item.name }}
</div>
<div class="menu_item_description">
{{ item.description }}
</div>
{% endif %}
<a href="{{ url_for('delete_item', item_id=item.id) }}">Delete</a>
</div>
</li>
{% endfor %}
</ul>
<a href="{{ url_for('post') }}" class="save">Save & Post</a>
</div>
</div>
</body>
</html>
Основная цель в файле маршрутов - post () и как сериализовать переупорядоченное меню-items
rout.py
from flask import Flask, render_template, flash, redirect, url_for
from siamsite.forms import NewItem
from flask_sqlalchemy import SQLAlchemy
class MenuItem(db.Model):
id = db.Column(db.Integer, primary_key=True, autoincrement=True)
# rank = db.Column(db.Integer)
name = db.Column(db.String(100), unique=False, nullable=False)
description = db.Column(db.Text)
head = db.Column(db.Boolean, default=False)
spice = db.Column(db.Boolean, default=False)
vegetarian = db.Column(db.Boolean, default=False)
image_file = db.Column(db.String(20), nullable=False, default='default.jpg')
def __repr__(self):
return f"MenuItems('{self.name}', '{self.description}')"
@app.route("/", methods=['GET', 'POST'])
def index():
form = NewItem()
if form.validate_on_submit():
new_item = MenuItem(name=form.name.data,
description=form.description.data,
head=form.head.data
)
db.session.add(new_item)
db.session.commit()
flash('You successfully added a new menu item!', 'success')
return redirect(url_for('index'))
items = MenuItem.query.all()
return render_template('index.html', form=form, items=items, title='Siam Street Food')
@app.route("/post", methods=['GET', 'POST'])
def post():
#serialize the re-ordered list here by changing the item MenuItem id
#in sqlalchemy to make it match the order of the re-ordered list
db.session.commit()
return redirect(url_for('index'))