<script>
    //UserType
    var $addLinkUserType = $('<a id="add_user_type" href="#" class="btn btn-success add_filter_link">Add Filter (UserType)</a>');
    var $newUserType = $('<div class="user_type_container"></div>').append($addLinkUserType);
    //ApplicationType
    var $addLinkAppType = $('<a id="add_app_type" href="#" class="btn btn-info add_filter_link">Add Filter (ApplicationType)</a>');
    var $newAppType = $('<div class="app_type_container"></div>').append($addLinkAppType);
    //ComplexType
    var $addLinkComplexType = $('<a id="add_complex_type" href="#" class="btn btn-warning add_filter_link">Add Filter (ComplexType)</a>');
    var $newComplexType = $('<div class="complex_type_container"></div>').append($addLinkComplexType);

    jQuery(document).ready(function () {
        //Filters UserType
        $userType = $('#form_UserType');
        $userType.append($newUserType);
        $userType.data('index', $userType.find(':input').length);

        $add_userType = $('#add_user_type');
        $add_userType.on('click', function (e) {
            e.preventDefault();
            appendForm($userType, $addLinkUserType);
        });

        //Filters AppType
        $appType = $('#form_ApplicationType');
        $appType.append($newAppType);
        $appType.data('index', $userType.find(':input').length);

        $add_appType = $('#add_app_type');
        $add_appType.on('click', function (e) {
            e.preventDefault();
            appendForm($appType, $addLinkAppType);
        });

        //Filters ComplexType
        $complexType = $('#form_ComplexType');
        $complexType.append($newComplexType);
        $complexType.data('index', $complexType.find(':input').length);
        $add_complexType = $('#add_complex_type');
        $add_complexType.on('click', function (e) {
            e.preventDefault();
            appendForm($complexType, $addLinkComplexType);
        });

        function appendForm($collectionHolder, $newLinkLi) {
            var prototype = $collectionHolder.data('prototype');
            var index = $collectionHolder.data('index');
            var newForm = prototype.replace(/__name__/g, index).replace(/label__/g, index);
            $collectionHolder.data('index', index + 1);
            var $newFormLi = $('<div class="form-group"></div>').append(newForm);

            $newFormLi.append('<a href="#" class="remove-tag btn btn-danger">x</a>');
            $newLinkLi.before($newFormLi);

            $('.remove-tag').click(function (e) {
                e.preventDefault();
                $(this).parent().remove();
                return false;
            });
        }
    });
</script>

<style>
    .user_type_container .form-group {
        padding-left: 10px;
        padding-right: 10px;
        background: #edf8e7;
    }

    .app_type_container .form-group {
        padding-left: 10px;
        padding-right: 10px;
        background: #def5f5;
    }

    .complex_type_container .form-group {
        padding-left: 10px;
        padding-right: 10px;
        background: #f5efde;
    }
</style>
