jQuery ui sortable – сохранить в базу данных с помощью Python / Flask / SQLite

Мне нужен эффект перетаскивания, просто найти jQuery для сортировки наиболее жизнеспособного и простого решения, но я бы хотел сохранить позиции после переупорядочения. Используя php / sqlite, я могу это сделать, но поскольку я использую флягу фрейма, решение должно быть в python. Я пришел к этому поисковому коду

HTML: 

$(function() { var $sortables = $("#sortMe").sortable({ stop: function() { var sortedItems = $sortables.sortable("toArray"); } }); });

ру: 

 app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///db.sqlite' class Sortable(db.Model): __tablename__ = 'sortables' id = db.Column(db.Integer, primary_key=True, autoincrement=True) data = db.Column(db.String) def __init__(self, data): self.data = data @app.route("/saveorder", methods=['GET', 'POST']) def save_order(): if request.method == "POST":

редактировать.

теперь, я получил это

HTML: 

  $(function() { $('#sortMe').sortable({ update: function(event, ui) { var postData = $(this).sortable('serialize'); console.log(postData); $.ajax({ url: '/saveorder', type: 'POST', contentType: 'application/json', dataType: 'json', data: JSON.stringify({list: postData}), success: function (ret) { alert('JSON posted: ' + JSON.stringify(ret)); } }); } }); });

ру: 

 @app.route("/saveorder", methods=['GET', 'POST']) def saveorder(): json = request.json print(json) return jsonify(json)

я нашел сольвацию

https://github.com/h01000110/sortable-flask

app.py 

 from flask import Flask, render_template, request, jsonify from flask_sqlalchemy import SQLAlchemy app = Flask(__name__) app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///db.sqlite' app.config['SQLALCHEMY_TRACK_MODIFICATIONS'] = True db = SQLAlchemy(app) class Sortable(db.Model): __tablename__ = 'sortables' id = db.Column(db.Integer, primary_key=True, autoincrement=True) data = db.Column(db.String) def __init__(self, data): self.data = data db.create_all() @app.route('/') def index(): sort = Sortable.query.filter_by(id=1).first() ordem = str(sort.data) return render_template('index.html', sort=sort, ordem=ordem) @app.route('/post', methods=['GET', 'POST']) def post(): json = request.json x = json.replace('item[]=', ',') y = x.replace('&,', '') final = y.replace(',', '') sort = Sortable.query.filter_by(id=1).first() sort.data = final db.session.commit() return jsonify(final) if __name__ == '__main__': app.run(debug=True)

index.html 

 <html> <head> <title>Flask example</title> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> <script> $(function(){ $('#sortMe').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> <ul id="sortMe"> {% for i in ordem %} <li id="item_{{ i }}">item {{ i }}</li> {% endfor %} </ul> </body> </html>
Interesting Posts

Чрезмерная задержка в запросе CORS AJAX на локальный сервер WSGI в Chrome

Как я могу отобразить результат поиска на основе фильтрованного значения, предоставленного пользователем?

Неопределенный результат запроса Deferred AJAX на Flask

Пилоны и NodeJS / Comet

CORS – использование AJAX для публикации на веб-службе Python (webapp2)

Я пытаюсь сделать чат-приложение с длинным опросом, используя Twisted и jQuery (с Django). Как передать запросы обратно в JS?

Django: передача данных AJAX POST в Django дает MultiValueDictKeyError, хотя ключ существует

запрос django ajax

Selenium wait.until для проверки завершенного запроса ajax – ошибка throw

Выполнение Javascript через Python