Jquery 和 Twig - 操作 jquery 内的 twig 数组集

Question

我正在尝试 "sort" 使用 bootstrap 插件分层 select 的选项，该插件需要识别每个项目的 "order"。

鉴于此，我执行了一个数据库搜索，只获取 select 中列出的每个项目的顺序，将它们放在 twig 中设置的数组中，并尝试设置每个值每个选项的数组。

注意：我正在尝试使用这个插件https://neofusion.github.io/hierarchy-select/index.html#

{% set ordem = [] %}
{% for item in cPublicaItemEstruturas %}
    {% if item not in ordem %}
        {% set ordem = ordem|merge([item.ordem]) %}
    {% endif %}
{% endfor %}

{% for i in ordem %}
    {{ i }}<!--Results in 1 1 1 1 2 3 2 3 1 2 3 1 2 1 2 3 4 1-->
    <script>
        $('#c_publica_item_estrutura_itemPai option').attr('data-level', '{{ i }}');
    </script>
{% endfor %}

我期待这样的事情：

console.log($('#c_publica_item_estrutura_itemPai option').attr('data-level', 1));
console.log($('#c_publica_item_estrutura_itemPai option').attr('data-level', 2));
console.log($('#c_publica_item_estrutura_itemPai option').attr('data-level', 3));
console.log($('#c_publica_item_estrutura_itemPai option').attr('data-level', 2));
console.log($('#c_publica_item_estrutura_itemPai option').attr('data-level', 3));
console.log($('#c_publica_item_estrutura_itemPai option').attr('data-level', 1));

但他们都只得出第一个数组索引，即 1。

Answer 1

您的做法无效，因为在 {% for i in ordem %} 的每次迭代中，您都将当前索引值设置为所有 select 选项。你得到 data-level="1" for all 不是因为它在第一次迭代时停止，而是因为 ordem 的最后一个索引的值是 1.

您只需要稍微更改一下代码：

{% set ordem = [] %}
{% for item in cPublicaItemEstruturas %}
    {% if item not in ordem %}
        {% set ordem = ordem|merge([item.ordem]) %}
    {% endif %}
{% endfor %}

//changes start here
<script>
    var ordem = {{ ordem|json_encode }};
    var i = 0;
    $('#c_publica_item_estrutura_itemPai > option').each(function() {
        $(this).attr('data-level', test[i]);
        i++;
    });
</script>

看到我在这里做什么了吗？

1- 我将 ordem 传递给 javascript 数组；
2-我遍历 select 选项；
3- 对于每个选项，我将 data-level 设置为数组当前索引的值。

Jquery 和 Twig - 操作 jquery 内的 twig 数组集

Jquery and Twig - Manipulate twig array set inside jquery

jquery

symfony

twig