Question

我正在尝试使用select2获取包括父母和孩子的tp节目在内的所有数据。我发现一个example对它很有用。尝试将“儿童”更改为“ childPools”时，出现错误

未捕获的TypeError：无法读取null的属性“ concat”

 var FRUIT_GROUPS = [
            {
                id: '',
                text: 'Citrus',
                childPools: [
                    { id: 'c1', text: 'Grapefruit' },
                    { id: 'c2', text: 'Orange' },
                    { id: 'c3', text: 'Lemon' },
                    { id: 'c4', text: 'Lime' }
                ]
            },
            {
                id: '',
                text: 'Other',
                childPools: [
                    { id: 'o1', text: 'Apple' },
                    { id: 'o2', text: 'Mango' },
                    { id: 'o3', text: 'Banana' }
                ]
            }
        ];

        $('#fruitSelect').select2({
            multiple: false,
            placeholder: "Select fruits...",
            data: FRUIT_GROUPS,
            query: function (options) {
                var selectedIds = options.element.select2('val');
                var data = jQuery.extend(true, {}, FRUIT_GROUPS);
                var selectableGroups = $.map(data, function (group) {
                    var areAllChildrenSelected = true,
                        parentMatchTerm = false,
                        anyChildMatchTerm = false;
                    if (group.text.toLowerCase().indexOf(options.term.toLowerCase()) >= 0) {
                        parentMatchTerm = true;
                    }
                    var i = group.childPools.length
                    while (i--) {
                        var child = group.childPools[i];

                        if (selectedIds.indexOf(child.id) < 0) {
                            areAllChildrenSelected = false;
                        };

                        if (options.term == '' || (child.text.toLowerCase().indexOf(options.term.toLowerCase()) >= 0)) {
                            anyChildMatchTerm = true;
                        }
                        else if (!parentMatchTerm) {
                            var index = group.childPools.indexOf(child);
                            if (index > -1) {
                                group.childPools.splice(index, 1);
                            };
                        };
                    };

                    return (!areAllChildrenSelected && (parentMatchTerm || anyChildMatchTerm)) ? group : null;
                });

                options.callback({ results: selectableGroups });
            }
        }).on('select2-selecting', function (e) {
            var $select = $(this);
            if (e.val == '') {
                e.preventDefault();
                $select.select2('data', $select.select2('data').concat(e.choice.childPools));
                $select.select2('close');
            }
        });

我在将选择连接到select2('data')的下一行出现错误。

$select.select2('data',$select.select2('data').concat(e.choice.children));

对这个错误有任何想法吗？

Answer 1

在选择父项时遇到的错误是因为您禁用了多项选择，从而使data属性保留其默认值NULL。 Have a look at the documentation.清楚地表明，启用多重选择后，数据属性需要一个对象数组。通过调用select2('data')将返回表示当前选择的JavaScript对象数组。

您还使用了childPools代替了API文档不允许的子代。 API期望在传递给Select2方法的JSON中满足以下要求。

在<optgroup>节中生成选项时；选项应嵌套在每个组对象的children键下。该组的标签应指定为该组相应数据对象上的text属性。

Select2要求每个对象都包含一个id和一个text属性。与数据对象一起传递的其他参数将包含在Select2公开的data对象上。

Select2仅支持单层嵌套。不能保证任何其他级别的嵌套都可以在所有浏览器和设备上正确显示。

Click here to read API Documentation on Select2 Data sources.

无法在select2中读取null的属性“ concat”

1 个答案: