Question

我正在尝试从我的数据库中重新获取数据并使用select2和jinja2预先选择多项选择。

我的jija2 / html代码：

<span class="input-group-addon">Relocate Where</span>
        {% if not context.relocate_to %}
            <input class="form-control" id="relocate_to" value="" type="hidden" name="relocate_to" data-placeholder="Choose province" />
        {% else %}
            {% for v in context.relocate_to|batch(9, '&nbsp;') %}
                <input class="form-control" id="relocate_to" value="{{v}} " type="hidden" name="relocate_to" data-placeholder="Choose province" />
            {% endfor %}
        {% endif %}

我的Js：

$.getJSON("{{'provinces.json'|route_url}}").success(function(data) {
        $("#relocate_to").select2({
            data:data,
            multiple: true
        maximumSelectionSize: 9
        });
    });

这只会使用1标签填充多选，这是错误的，因为此用户的数据库中有2 Provinces，并且可以选择9个省。

我看过这些question，但这对我没什么帮助。

如何实现使用jinja2和select2保留数据的目标？

使用jQuery保留数据会更好吗？

Answer 1

我想知道是不是因为你有多个具有相同id的元素... 试试这个：

<input class="form-control" id="relocate_to_{{ loop.index }}" value="{{v}} " type="hidden" name="relocate_to" data-placeholder="Choose province" />

您还需要为您的js ...

获取getElementsByName

$.getJSON("{{'provinces.json'|route_url}}").success(function(data) {
        $("[name=relocate_to]").select2({
            data:data,
            multiple: true
        maximumSelectionSize: 9
        });
    });

希望这有帮助。

Answer 2

我找到了另一种方法来做我想做的事情：

在我的python代码中，我创建了一个带有数据的dict来创建select然后我这样做：

<span class="input-group-addon">relocate to</span>
    <select name="relocate_to" id="relocate_to" multiple="" class="form-control">
        {% for k, v in relocate_list.iteritems() %} <!-- relocate_list was a list, is now a dictionary -->
            {% if k in context.relocate_to %}
                <option value="{{ k }}" selected="">{{ v }}</option> 
            {% else %}
                <option value="{{ k }}">{{ v }}</option>
            {% endif %}
        {% endfor %}
    </select>

我希望这可以在将来帮助某人。

然后我只是初始化select2：

$("#relocate_to").select2({
        maximumSelectionSize : 9
    });

如何使用jinja2和select2预先选择多个选项？

2 个答案: