在 django 中刷新页面时下拉菜单显示所选项目答案

【问题标题】：drop down menu show selected item when page refreshes in django在 django 中刷新页面时下拉菜单显示所选项目
【发布时间】：2014-03-16 01:55:18
【问题描述】：

有没有办法让它在使用 html 下拉表单并且页面在 django/python 中刷新以使下拉菜单停留在选定的过滤器上？这是我目前的表格：

<form name="portfolio_filter" action="" method="get"> 
    <select class="orderby pull-right push-bottom" name="orderby" onChange="location = this.options[this.selectedIndex].value">
            <option value="">Filter for Products</option>
            <option value="{% url 'products:portfolio_filtered' '-our_rating' %}">Best Match</option>
            <option value="{% url 'products:portfolio_filtered' '-created' %}">Newest</option>
            <option value="{% url 'products:portfolio_filtered' 'title' %}">Sort A-Z</option>
            <option value="{% url 'products:portfolio_filtered' '-title' %}">Sort Z-A</option>
            <option value="{% url 'products:portfolio_filtered' '-unit_price' %}">Price: Highest to Lowest</option>
            <option value="{% url 'products:portfolio_filtered' 'sale_price' %}">Price: Lowest to Highest</option>
    </select>
</form>

表单效果很好，让我进入产品组合列表页面并按标题、评级等对其进行过滤。但每次我这样做时，下拉菜单默认为第一项：

<option value="">Filter for Products</option>

我希望它保留在所选项目上。因此，如果我转到“评级”，那么当页面重新加载时，它会在下拉菜单中显示第一个“评级”过滤器。我相信 html 是 <selected="selected"> 或类似的东西，我想知道我是否会使用 Javascript 或 JQuery 填充？但我不知道怎么做？

谢谢

【问题讨论】：

标签： javascript jquery python html django

【解决方案1】：

最好通过 ajax 以这种方式加载页面，表单保持不变，只有其他部分会重新加载。

或者

如果必须重新加载页面，则使用 django-sessions 或 django 缓存并将会话或缓存键设置为您选择的值，然后再刷新并将其取回并将其发送到前端。

【讨论】：

你能给我一个代码示例，说明如何使用 django-sessions 做到这一点吗？我尝试使用 render_to_string 根据选择的过滤器返回 html 并附加但到目前为止我无法让它工作。谢谢。
最好的选择是使用 jquery 而不是重新加载整个页面。或者说用户从下拉列表中选择一个选项，然后使用 Onchange 事件和 ajax 调用将选择的值发送到服务器端并将值传递到后端。一旦值在控制器使用、缓存或会话变量中被发送回。比如request.session['selected_val'] = 'selected value'，页面刷新后使用request.session['selected_val']检索。

【解决方案2】：

我暂时使用 Django 来做这件事。我做了一个字典：

portfolio_filters = {'title': 'Sort A-Z',
                    '-our_rating': 'Best Match', 
                    '-created': 'Newest',
                    'sale_price': 'Price Lowest to Highest'}

然后将该字典输入到我的分页视图中：

def portfolio_filtered(request, slug):

template_name = 'products/shop-full-width.html'
products_list = Product.objects.order_by(slug)
paginator = Paginator(products_list, 12)
ideas = Idea.objects.all()

try:
    page = int(request.GET.get('page', '1'))
except:
    page = 1

try:
    products = paginator.page(page)
except(EmptyPage, InvalidPage):
    products = paginator.page(paginator.num_pages)

return render_to_response(template_name,
    {'ideas': ideas, 'products': products,
    'portfolio_filters': portfolio_filters, 'slug': slug},
    context_instance=RequestContext(request))

然后在我的模板中，我使用了这个 For Loop / If 语句：

<select class="orderby pull-right push-bottom" name="orderby" onChange="location = this.options[this.selectedIndex].value">
        <option value="">Filter for Products</option>
        {% for k, v in portfolio_filters.items %}
            {% if k == slug %}
                <option value="{% url 'products:portfolio_filtered_two' %}/{{ k }}/" selected="selected">{{ v }}</option>
            {% else %}
                <option value="{% url 'products:portfolio_filtered_two' %}{{ k }}/">{{ v }}</option>
            {% endif %}
        {% endfor %}
</select>

如果重要的话，这也是我的网址：

url(r'^portfolio/filtered/$', views.portfolio_filtered, name='portfolio_filtered_two'),

【讨论】：