Question

我有一个选择框，可以在更改时调用函数。该函数从“Products”选择框中查找所选值我想将选定的值抛给我的views.py，在一些操作后返回数据列表并填充目标的选择框。
我想为此目的使用ajax。请帮忙。

我的代码如下所示：

<script type="text/javascript">
    function select_value()
    {
        var e = document.getElementById("Product");
        var prod = e.options[e.selectedIndex].text
        console.log(prod)
    }
</script>

这就是我的选择框：

<table>
    <tr>
        <td>
            <select id="Product" onChange="select_value();">
                {% for products in product_name_list %}
                    <option>{{products|safe}}</option>
                {% endfor %}
            </select>
        </td>
        <td>
            <select id="dest">
                {% for des in destinations_name_list %}
                    <option>{{des|safe}}</option>
                {% endfor %}
            </select>
        </td>
     </tr>
</table>

这是我的views.py：

def selection_filter(request,prod):
    destination_objs = Destination.objects.filter(product=prod)
    destination_name = destination_objs.values_list('name')
    destination_name_list = []
    for iter_name in destination_name:
        destination_name_list.append(iter_name[0].encode('utf-8'))

    return render_to_response('temp/test.html',
                {"destination_name_list"    :   destination_name_list},
                )

Answer 1

我认为您可能误解的一点是，您的整个页面的Django模板不会“神奇地”重新渲染。在Django的标准模型 - 视图 - 模板范例中，模板在初始请求时仅呈现一次。你写它的方式，除非有一个默认的产品选择，你将在第一个渲染中有一个尴尬的空<select>。但是忽略了......

对于这样的问题，您需要两个视图：一个用于呈现整个页面，另一个用于提供Ajax响应。第二个视图有两个主要选项：1）通过脚本后响应返回JSON以进行解释/呈现，或者2）返回完全呈现的HTML片段以直接插入到DOM中。在这种情况下，我只是选择2。

我建议查看Jquery，因为它使Ajax和DOM操作变得非常简单。

如果你有Jquery，就像添加到你的脚本一样简单：

$.get('/destinations/' + prod)
.done(function (html) {
    $(#dest).html(html);
});

（你可以在没有Jquery的情况下做同样的事情，但它需要更多的争论）

您的test.html文件应包含：

{% for des in destinations_name_list %}
    <option>{{des|safe}}</option>
{% endfor %}

如何通过ajax从django模板向视图发送值？

1 个答案: