{% block oro_serialized_fields_is_serialized_type_widget %}
    {% spaceless %}
        {{ form_widget(form) }}
        <script type="text/javascript">
            loadModules(['jquery', 'oroui/js/mediator'], function ($, mediator) {
                $(function () {
                    var storageTypeSelector  = 'form[name=oro_entity_extend_field_type] select[data-ftid=oro_entity_extend_field_type_is_serialized]';
                    var fieldTypeSelector    = 'form[name=oro_entity_extend_field_type] select[data-ftid=oro_entity_extend_field_type_type]';
                    var _onChangeStorageType = function () {
                        var serializableTypes = {{ form.vars.serializableTypes|json_encode()|raw }};
                        var excludeTypes = [];
                        {% if form.parent.vars.excludeTypes is defined %}
                            excludeTypes = {{ form.parent.vars.excludeTypes|json_encode()|raw }};
                        {% endif %}
                        $(fieldTypeSelector + ' optgroup').each(function (index, value) {
                            $.each($(value).find('option'), function (index, value) {
                                $(value).removeAttr('disabled');
                                var selectedStorageType = $(storageTypeSelector).val();
                                if (selectedStorageType == 1) {
                                    if (serializableTypes.indexOf($(value).val()) === -1) {
                                        $(value).attr('disabled', 'disabled');
                                    }
                                } else {
                                    if (excludeTypes.indexOf($(value).val()) !== -1) {
                                        $(value).attr('disabled', 'disabled');
                                    }
                                }
                            })
                        });
                        $(fieldTypeSelector).select2('val', '');
                    };

                    $(storageTypeSelector).on('change.changeStorageType', _onChangeStorageType);

                    mediator.once('page:beforeChange', function () {
                        $(storageTypeSelector).off('change.changeStorageType', _onChangeStorageType);
                    });
                })
            });
        </script>
    {% endspaceless %}
{% endblock %}