我在Django项目JS脚本中使用的是为了使一个列表中的元素可以通过拖放功能进行排序。但是,我得到的问题是元素的新顺序仅在本地保存。
脚本的JS库可用:https://github.com/SortableJS/Sortable
在模板上调用的函数:
{% extends 'base.html' %}
{% block content %}
<div class="container-fluid">
<div id="simpleList" class="list-group">
{% for issue in backlog.issue_set.all %}
<div class="list-group-item">
<div style="float:left;"><strong><a href="{% url 'issue-edit' issue.pk %}">{{ issue.title }}</a></strong></div>
<div style="float: right;"><a href="#" class="btn btn-success btn-circle btn-sm"><i class="fas">{{ issue.remaining_estimate }}</i></a></div>
<br /><br /><hr style="border-top: dashed 1px;"></hr>
<div style="float: left;"><small>Assignee: <strong>{{ issue.assignee }}</strong></small></div>
<div style="float: right;"><small>Initiative: <strong>{{ issue.initiative }}</strong></small></div><br />
<div style="float: left;"><small>Priority: <strong>{{ issue.priority }}</strong></small></div>
<div style="float: right;"><small>Epic: <strong>{{ issue.epic }}</strong></small></div>
</div>
{% endfor %}
</div>
</div>
<!-- JS Script for Drag&Drop -->
<script>
Sortable.create(simpleList, {
group: "localStorage-example",
store: {
/**
* Get the order of elements. Called once during initialization.
* @param {Sortable} sortable
* @returns {Array}
*/
get: function (sortable) {
var order = localStorage.getItem(sortable.options.group.name);
return order ? order.split('|') : [];
},
/**
* Save the order of elements. Called onEnd (when the item is dropped).
* @param {Sortable} sortable
*/
set: function (sortable) {
var order = sortable.toArray();
localStorage.setItem(sortable.options.group.name, order.join('|'));
}
}
})
</script>
{% endblock content %}
您有什么技巧/想法如何将其保存在数据库中的每个元素上?我已经在字段“ position”中定义了Issue
模型,我想在列表中保存位置。
在此先感谢您的支持和帮助!