用户可选择使用Jinja2、HTML和javascript对循环列表进行排序

我在jija2中有一个使用for循环的HTML列表。我想有一个“排序”按钮，用户可以点击排序，切换升序/降序。在stackoverflow中发现与此问题类似的问题：

答案包含了我应该如何设置，但我仍在努力实现

我将列表设置为：

 <!-- This is for "default" -->
    {% set sort_on = 'lastName' %}
    {% set order_rev = True %}

<!-- This is the "sort" function I want to call -->
<input type="button" value="Sort by Name" style='display:inline' onclick="sorter();"/>

<!-- Below is the list -->
{% for profile in profileList|sort(attribute=sort_on, reverse=order_rev) %}
<div class="row" id="table">
    <div class="col-md-2" id="name">
        <strong>{{profile["lastName"]}}, {{profile["firstName"]}}</strong>
    </div>

        <div class="col-md-1" id="score">
            {{profile["score"]}}    
        </div>
</div>

{%set sort_on='lastName%}
{%set order_rev=True%}
{profileList中的配置文件的%sort（attribute=sort\u on，reverse=order\u rev）%}
{{profile[“lastName”]}，{{profile[“firstName”]}
{{profile[“score”]}

我想在javascript（或任何其他建议）中切换以下选项：

功能分类程序（）{
如果（触发器==1）{
{%set sort_on='lastName%}
{%set order_rev=True%}
切换器=0
}否则{
{%set sort_on='lastName%}
{%set order_rev=False%}
切换器=1
}
}

我尝试了上面的代码，但我不知道如何调用函数和执行排序而不刷新页面，并且一旦刷新，就不会保存任何设置，因此返回默认设置

如果您有更好的解决方案（而不是我上面解释的），请建议

---

请告知。您的意见将不胜感激

您在这里混淆了服务器端代码和客户端代码；Jinja完全是在服务器端运行的，您不能通过在客户端设置JS来改变呈现的内容。您能为我如何实现排序功能提供指导吗？感谢@MartijnPieters的支持。这里有很多帖子也展示了如何处理客户端排序。链接到的帖子处理服务器端排序。还有一个选项是使用AJAX加载新版本的表，排序服务器端。但是给你举一个所有这些的例子就太宽泛了，我可以使用List.js，现在我关心的所有这些都可以作为客户端排序，工作得非常好。谢谢你为我指明了正确的方向@MartijnPieters

<script>
function Sorter(){
if(toggler==1){
    {% set sort_on = 'lastName' %}
    {% set order_rev = True %}
    toggler = 0
}else{
    {% set sort_on = 'lastName' %}
    {% set order_rev = False %}
    toggler = 1
    }
}
</script>