Question

我在Twig模板中有以下代码：

<table class="table">
    <thead>
    <tr>
        <th>License ID</th>
        <th>Quote ID</th>
    </tr>
    </thead>
    <tbody>
    {% for key,value in data %}
        <tr>
            <td>{{ value.id }}</td>
            <td>
                <select class="form-control select2" data-placeholder="--Select One--"></select>
            </td>
        </tr>
    {% endfor %}
    </tbody>
</table>

上面的代码根据来自后端的数据转换为一个或多个SELECT元素。

每个人都需要运行真正大而缓慢的查询来获取应该存在的数据。

我在想的是将它们渲染为空（没有任何值，只是初始占位符），当我打开它们时，然后填充它的数据，这样我一次只运行一个查询（通过AJAX）。

我也应该 - 虽然不知道这是一个好主意（你告诉我） - 关闭销毁所有SELECT值。

注意：我应该说Select2元素包含在jQuery UI对话框中，但这不应该是一个问题。

这就是我的代码的样子：

addtoquoteDialog.dialog({
    autoOpen: false,
    modal: true,
    width: 800,
    height: 600,
    resizable: false,
    buttons: {
        "Cancel": function () {
            $(this).dialog('close');
        },
        "Add to Quote": function () {
            $(this).dialog('close');
        }
    },
    open: function (event, ui) {
        var $select2selector = $('.select2');
        $select2selector.select2();
        $select2selector.on('select2:open', function (e) {
            var id = $(this).data('id');
            $select2selector.select2({
                ajax: {
                    url: Routing.generate('quote_select_data', {id: id}),
                    dataType: 'json'
                }
            });
        }).on('select2:closing', function (e) {
            // Destroy the select values
        });
    }
});

但是我提出Cannot read property 'query' of null着名的错误消息并且没有触发AJAX调用。

我已经看过很多像这样的问题（例如this one），但似乎没有一个像我一样，所以我完全迷失了。

可以告诉我我的代码中缺少什么吗？

~~我看到this example但这种情况发生在SELECT初始化时，我是对的吗？~~

~~处理此问题的正确方法是什么？~~

如何通过AJAX调用在open事件上填充Select2元素？

0 个答案: