descriptionForm.html

<!--#
    This file is part of the auth package.
    (c) Maarch Prospre DE LAURE <prosper.delaure@maarch.org>

    For the full copyright and license information, please view the LICENSE
    file that was distributed with this source code.
#-->
<form id="descriptionForm" class="form-horizontal" data-translate-catalog="documentManagement/document">
    <div id="allFields">
        <div id="archivalProfileFields"></div>
        <div id="customFields"></div>
    </div>

    <div class="form-group">
        <div class="dropup col-xs-12" id="customFieldAddBtn">
            <button type="button" class="addCustomField btn btn-sm btn-link pull-right" data-type="text" title="Add field">
                &nbsp;<i class="fa fa-plus">&nbsp;</i>Add field
            </button>
            <!--ul class="dropdown-menu pull-right metadataList" aria-labelledby="dLabel">
                <li><a href='#' class="addCustomField" data-type="text">Text</a></li>
                <li><a href='#' class="addCustomField" data-type="name">Keyword</a></li>
                <li><a href='#' class="addCustomField" data-type="date">Date</a></li>
                <li><a href='#' class="addCustomField" data-type="boolean">Boolean</a></li>
                <li><a href='#' class="addCustomField" data-type="number">Numeric</a></li>
            </ul-->
        </div>
    </div>
</form>

<div class="hide">
    <!-- TEXT VARIABLE -->
    <div data-translate-catalog="documentManagement/documentMetadata">
        <span id="date_text">Date</span>
        <span id="number_text">Number</span>
        <span id="keyword_text">Keyword</span>
        <span id="byte_text">bytes</span>
    </div>

    <span id="preservation_text">Preservation</span>
    <span id="destruction_text">Destruction</span>
    <span id="retentionRule_text">%1$s after %2$s</span>
    <span id="object_header_new_text">Click to add '%1$s'</span>
    <span id="object_header_modify_text">Click to modify '%1$s'</span>
    <span id="object_required_text">* At least one field must be filled in.</span>

    <div data-translate-catalog="dates/dates">
        <span id="days_text">days</span>
        <span id="months_text">months</span>
        <span id="years_text" data-translate-context="unit">years</span>
        <span id="unlimited_text" >Unlimited</span>
    </div>

    <!-- ERROR MESSAGE -->
    <div data-translate-catalog="recordsManagement/message">
        <span id="fieldLabel_error">You must define all required fields.</span>
        <span id="customFieldLabel_error">You must define or remove all custom blank fields.</span>
        <span id="keywordLabel_error">A keyword label is missing.</span>
        <span id="retentionStartDateMissing_error">The retention start date is missing.</span>
        <span id="retentionRuleCodeMissing_error">The retention rule is missing.</span>
        <span id="documentMissing_error">You must deposit at least one document.</span>
    </div>
</div>
<span  id="addBtnTpl" class="input-group-btn hide">
    <button class="btn btn-success addArchiveDescriptionKeyword btn-sm" type="button" id="btnAddPrivilege" title="Add"><span class="fa fa-check"></span></button>
</span>
<div id="keywordTpl" class="input-group hide" name="keyword">
    <input type="text" class="form-control input-sm" data-enumerate ="true" disabled="" />
    <span class="input-group-btn">
        <button class="btn btn-danger btn-sm" type="button" name="btnDeleteKeyword" title="Delete"><span class="fa fa-trash-o"></span></button>
    </span>
</div>


<style>
.arrayDiv {
    padding-left: 0px;
    padding-right: 40px;
    list-style: none;
}

input:invalid {
    border-color: red;
}

.panel-title {
    font-size: 14px;
}

.control-label {
    padding-top: 3px;
}
</style>

<script type="text/javascript">
    $("#descriptionForm").keypress(function(e) {
    //To disable Enter keypress in this form
        if (e.which == 13) {
            return false;
        }
    });

    // METADATAS
    $('.addCustomField').on('click', function(e) {
        e.preventDefault();
        Metadata.addCustomField();
    });

    // Add row in array of metadata
    $('#allFields').on('click', '.addRowArray', function(e) {
        // click on button addRowArray won't work if input is empty
        var text = $(this).next("ul").children("li").children("input").val();
        if (text === "") {
            return;
        }
        Metadata.addArrayItem($(this).parent());
    });

    $('#allFields').on('click', '.removeRowArray', function(e) {
        e.preventDefault();
        Metadata.removeRowArray($(this));
    });

    function onError(e) {
        var parentCollapse = e.closest(".panel-collapse");
        if (parentCollapse.length) {
            parentCollapse.addClass("in");
            var focusOn = parentCollapse;
        } else {
            focusOn = e;
        }
        $('html,body').animate({
            scrollTop: $(focusOn).offset().top
        }, 'slow');
        e.focus();
        e.css({"border-color":"red"});
        Metadata.isValid = false;
    }

    function checkErrorInput(e){
        if (!e.val()){
            onError(e);
        }
        else {
            e.css({"border-color":""});
        }
    }

    function checkNumberInput(e){
        // Regexp now accept "," and "." for type number
        if (e.val() && !RegExp("^[0-9]*[,.]?[0-9]{1,}$").test(e.val())) {
           onError(e);
        }
        else {
            value = e.val().replace(",", ".");
            e.val(value);
            e.css({"border-color":""});
        }
    }

    function checkInput(e){
        var field = $(e).find("input");
        if (!field.val()){
            field.css({"border-color":"red"});
        }
        else {
            field.css({"border-color":""});
        }
    }

    $('#allFields').on('click', '.removeField', function(e) {
        e.preventDefault();
        Metadata.removeField($(this));
    });

    //Delete keyword
    $("#archivalProfileFields").on("click","[name=btnDeleteKeyword]", function() {
        var selectId = $(this).closest("[name=keyword").find('input').attr('name');
        var val = $(this).closest("[name=keyword").find('input').val();
        $(this).closest("[name=keyword").remove();
        $('#'+selectId).find('option[value="'+val+'"]').removeClass('hide');
    });

    //Add keyword
    $("#archivalProfileFields").on("click",".addArchiveDescriptionKeyword", function() {

        let val = null;
        let input = null;
        let name = $(this).data('select');
        let inputType = $(this).data('input-type');

        switch (inputType) {
            case "select" :
                input = $('#archivalProfileFields').find('[name="'+name+'"]').not("[disabled]");
                let option = input.find('option:selected');
                val =  option.text();
                break;

            case "input" :
                input = $('#archivalProfileFields').find('input[name="'+name+'"]').not("[disabled]");
                val =  input.val();
                break;
        }

        var tpl = $('#keywordTpl').clone().removeClass('hide');

        if(val) {
            tpl.find('input').val(val).attr('name',name);
            $('[name="list-'+name+'"]').append(tpl);

            switch (inputType) {
                case "select" :
                    input.find("option:selected").addClass('hide');
                    break;

                case "input" :
                    break;
            }

            input.val('');
        }

    });

    function guid() {
        function s4() {
            return Math.floor((1 + Math.random()) * 0x10000)
                .toString(16)
                .substring(1);
        }
        return s4() + s4() + '-' + s4() + '-' + s4() + '-' + s4() + '-' + s4() + s4() + s4();
    }

    var Metadata = {
        flagEmptyRequiredField : false,
        flagEmptyCustomField : false,
        isValid : true,
        isModification : false,

        addArchiveDescription : function(archiveDescription) {
            var descriptionField = archiveDescription.descriptionField;
            descriptionField.required = archiveDescription.required;
            descriptionField.readonly = archiveDescription.readonly;
            var target = $("#archivalProfileFields");
            var formGroup = Metadata.getFormGroup(descriptionField);
            target.append(formGroup);
        },

        getFormGroup: function(descriptionField) {
            var formGroup = $('<div class="form-group" />');
            var label = $('<label class="col-md-3 control-label" />')
            var spanLabel = $('<span name=descriptionLabel />').text(descriptionField.label);
            label.append(spanLabel);
            formGroup.append(label);
            var div = $('<div class="col-md-9" />');
            formGroup.append(div);

            switch (descriptionField.type) {
                case 'array':
                    var field = Metadata.getArrayDiv(descriptionField);
                    break;

                case 'object':
                    var field = Metadata.getObjectDiv(descriptionField);
                    break;

                case 'text':
                case 'string':
                    var field = Metadata.getTextInput(descriptionField);
                    break;

                case 'name':
                    var field = Metadata.getKeywordInput(descriptionField);
                    break;

                case 'number':
                    var field = Metadata.getNumberInput(descriptionField);
                    break;

                case 'date':
                    var field = Metadata.getDateInput(descriptionField, div);
                    break;

                case 'boolean':
                    var field = Metadata.getRadioInput(descriptionField);
                    break;

                default:
                    console.log("Type "+descriptionField.type+" of field "+descriptionField.name+" is not managed");
                    return;
            }

            formGroup.attr('name', descriptionField.name).attr('data-type', descriptionField.type);
            formGroup.data('description', descriptionField);

            div.append(field);

            if (descriptionField.required) {
                label.append($("<span style='color: red'>").text(" *"));
                field.attr("data-required", descriptionField.required);
            }

            if (descriptionField.readonly) {
                field.attr("data-readonly", descriptionField.readonly);
            }

            formGroup.data('field', field);

            return formGroup;
        },

        getTextInput : function (descriptionField) {
            var field = $('<input>')
                        .attr('type', 'text')
                        .addClass('form-control')
                        .addClass('input-sm');

            if(descriptionField.readonly && Metadata.isModification) {
                field.attr("readonly", true);
                field.attr("disabled", true);
            }

            if (descriptionField.default === "now") {
                let date = new Date();
                var day = ('0' + (date.getDate())).slice(-2);
                var month = ('0' + (date.getMonth()+1)).slice(-2);
                var year = date.getFullYear();

                let now = day + '-' + month + '-' + year;
                if (descriptionField.format === "datetime") {
                    now += ' ' + date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds();
                }
                field.val(now);
            }

            field.getValue = function() {
                if(field.data('required')){
                    checkErrorInput(field);
                }
                return this.val();
            };

            return field;
        },

        getKeywordInput : function (descriptionField) {
            if (descriptionField.ref) {
                return Metadata.getTypeahead(descriptionField);
            } else if (descriptionField.enumeration) {
                return Metadata.getSelect(descriptionField);
            } else {
                return Metadata.getTextInput(descriptionField);
            }
        },

        getNumberInput : function(descriptionField) {
            var field = Metadata.getTextInput(descriptionField);
            field.attr('placeholder', $('#number_text').text()).attr("pattern", "^[0-9]*[,.]?[0-9]{1,}$");

            field.getValue = function() {
                checkNumberInput(field);
                if(field.data('required')){
                    checkErrorInput(field);
                }
                return this.val();
            };

            return field;
        },

        getDateInput : function(descriptionField, parent) {
            var field = Metadata.getTextInput(descriptionField);
            field.attr('placeholder', $('#date_text').text());

            parent.append(field);
            if (descriptionField.format == 'datetime') {
                field.data('format', 'datetime');
                field.datetimepicker(dateTimePickerParams);
            } else {
                field.datepicker(DatePickerParams);
            }

            field.getValue = function() {
                if(field.data('required')){
                    checkErrorInput(field);
                }
                if (this.val()){
                    if (field.data('format') == 'datetime') {
                        var dateObject = this.data('DateTimePicker').date().format('YYYY-MM-DDTHH:mm:ss');

                        return dateObject;
                    } else {
                        var dateObject = this.datepicker('getDate');

                        return $.datepicker.formatDate('yy-mm-dd', dateObject);
                    }
                }
            };

            return field;
        },

        getTextArea : function(descriptionField) {
            var field = $('<textarea class="form-control input-sm" rows="1" style="resize: none; resize: vertical; height: 2.5em;" />');
            if (descriptionField.default !== null && descriptionField.default !== undefined && descriptionField.default !== "") {
                field.val(descriptionField.default);
            }

            if(descriptionField.readonly && Metadata.isModification) {
                field.attr("readonly", true);
                field.attr("disabled", true);
            }

            field.getValue = function() {
                if(field.data('required')){
                    checkErrorInput(field);
                }
                return $.trim(this.val());
            };

            return field;
        },

        getRadioInput : function(descriptionField) {
            var field = $('<div class="btn-group" data-toggle="buttons"/>');
            var falseGroup = $('<label class="btn btn-default"/>');
            falseGroup.append('<input type="radio" name="defaultValue" autocomplete="off" value="0">')
                      .append($('<i class="fa fa-times" />'));
            field.append(falseGroup);

            var nullGroup = $('<label class="btn btn-default active"/>');
            nullGroup.append('<input type="radio" name="defaultValue" autocomplete="off" value=""> &nbsp');
            field.append(nullGroup);

            var trueGroup = $('<label class="btn btn-default"/>');
            trueGroup.append('<input type="radio" name="defaultValue" autocomplete="off" value="1">')
                     .append($('<i class="fa fa-check" />'));
            field.append(trueGroup);

            if (descriptionField.default == 1 || descriptionField.default == 0) {
                field.find('[value=""]').parent().removeClass("active");
                field.find('[value="'+descriptionField.default+'"]').parent().addClass("active");
                field.find('[value="'+descriptionField.default+'"]').prop("checked", "checked");
            }

            if(descriptionField.readonly && Metadata.isModification) {
                $(field).find(".btn").addClass("disabled");
            }

            field.getValue = function() {
                if(field.data('required')){
                    if (this.find('.active').children("input").val()=="") {
                        this.css({"border-color":"red",
                                    "border-style":"solid"});
                        this.focus();
                        Metadata.isValid = false;
                    } else {
                        this.css({"border-color":"",
                                    "border-style":"unset"});
                    }
                }
                return this.find('.active').children("input").val();
            };

            return field;
        },

        getSelect : function(descriptionField) {
            var field = $('<select class="form-control input-sm"><option value="" /></select>')

            $.each(descriptionField.enumeration, function (index, value) {
                text = value;
                if (descriptionField.enumNames && descriptionField.enumNames[index]) {
                    text = descriptionField.enumNames[index]
                }
                field.append($('<option>', {
                    value: value,
                    text: text
                }));
            });
            if (descriptionField.default !== null && descriptionField.default !== undefined && descriptionField.default !== "") {
                field.val(descriptionField.default);
            }

            if(descriptionField.readonly && Metadata.isModification) {
                field.attr("readonly", true);
                field.attr("disabled", true);
            }

            field.getValue = function() {
                if(field.data('required')){
                    checkErrorInput(field);
                }
                return $.trim(this.val());
            };

            return field;
        },

        getTypeahead : function(descriptionField) {
            var field = Metadata.getTextInput(descriptionField);
            field.attr('name', descriptionField.name);
            setTimeout(function(){
                var data = new Bloodhound({
                    datumTokenizer: Bloodhound.tokenizers.obj.whitespace(),
                    queryTokenizer: Bloodhound.tokenizers.whitespace,
                    remote: {
                        url: '/descriptionRef/'+descriptionField.name+'?query=%QUERY',
                        wildcard: '%QUERY'
                    }
                });
                data.initialize();

                field.typeahead(
                    {
                        hint: true,
                        highlight: true,
                        minLength: 1
                    },
                    {
                        name: 'data',
                        source: data.ttAdapter(),
                        templates: {
                            suggestion: function(data) {
                                delete data._query;
                                var html = $('<div>');
                                var keyname = Object.keys(data)[0];
                                var key = data.keyname;
                                html.append($('<strong class="badge">').text(key));
                                delete data[keyname];
                                var value = Object.keys(data).map(function(name){return data[name]}).join(" - ");
                                html.append(' '+value);
                                return html;
                            }
                        }
                    }
                ).on('typeahead:selected', function ($event, suggestion, source) {
                    var keys = Object.keys(suggestion); //fetched the key at first index
                    field.val(suggestion[keys[0]]);
                    field.typeahead('val', suggestion[keys[0]]);
                });
            }, 300);


            return field;
        },

        getObjectDiv : function(descriptionField) {
            id = guid();
            var div = $('<div class="panel panel-default" style="margin-bottom:0px;">');

            var heading = $('<div class="panel-heading"/>');
            div.append(heading);

            var title = $('<h4 class="panel-title" style="display: inline-block;" />');
            heading.append(title);

            var anchor = $('<a role="button" data-toggle="collapse" aria-expanded="true"/>');

            // Add title to Collapse
            var objectHeader = $("#object_header_new_text").text().replace(/%1\$s/g, descriptionField.label);
            anchor.attr('href', "#"+id);
            anchor.text(objectHeader);
            title.append(anchor);

            if (descriptionField.required) {
                var requiredTitle = $("#object_required_text").clone();
                requiredTitle.css({"font-size":"12px", "color":"red", "display":"block"});
                heading.append(requiredTitle);
            }

            var collapse = $('<div class="panel-collapse collapse">').attr('id', id);
            div.append(collapse);

            var panelBody = $('<div class="panel-body">');
            collapse.append(panelBody);

            var input = $('<input class="hide" type="text" data-type="object" value="">');
            panelBody.append(input);

            var propertyList = $('<ul style="padding-left: 0px; padding-right: 40px; list-style: none">');
            panelBody.append(propertyList);

            $.each(descriptionField.properties, function() {
                if (this.internal) {
                    return;
                }
                formGroup = Metadata.getFormGroup(this);

                var item = $("<li class='col-12'></li>");
                item.append(formGroup);

                item.data('formgroup', formGroup);
                item.data('field', formGroup.data('field'));

                propertyList.append(item);
            });

            div.data('propertyList', propertyList);

            if(descriptionField.readonly && Metadata.isModification) {
                div.find("input, select").attr("readonly", true);
                div.find("input, select").attr("disabled", true);
                $(div).find(".btn").addClass("disabled");
            }

            div.getValue = function() {
                var object = {};
                var properties = this.data('propertyList').children('li');

                $.each(properties, function() {
                    var field = $(this).data('field');
                    var name = $(this).data('formgroup').attr('name');
                    var value = field.getValue();
                    if (value) {
                        object[name] = value;
                    }
                });

                if (!div.parent("li").length){
                    if(field.data('required')){
                        if (!Object.keys(object).length) {
                            onError(field);
                        } else {
                            field.css({"border-color":""});
                        }
                    }
                }

                if (Object.keys(object).length) {
                    return object;
                }
            };

            return div;
        },

        getArrayDiv : function(descriptionField) {
            var div = $('<div>');

            div.attr("data-itemtype", descriptionField.itemType);
            if (descriptionField.itemType.type) {
                div.attr("data-itemtype", descriptionField.itemType.type)
            }

            var addButton = $('<button type="button" class="addRowArray btn btn-sm btn-success pull-right" title="Add data">&nbsp;<i class="fa fa-check">&nbsp;</i></button>');
            div.append(addButton);

            var itemList = $('<ul class="arrayDiv">');
            div.append(itemList);
            div.data('itemlist', itemList);
            div.data('item-description', descriptionField.itemType);
            div.data('description', descriptionField);

            var item = Metadata.getArrayItem(descriptionField);
            itemList.append(item);

            if(descriptionField.readonly && Metadata.isModification) {
                div.find("input, select").attr("readonly", true);
                div.find("input, select").attr("disabled", true);
                $(div).find(".btn").addClass("disabled");
            }

            div.getValue = function() {
                var values = [];
                var items = this.data('itemlist').children('li');

                $.each(items, function() {
                    var field = $(this).data('field');
                    var value = field.getValue();
                    if (value) {
                        values.push(value);
                    }
                });

                if(this.data('required')){
                    if (values.length == 0) {
                        if (this.data("itemtype") == "object") {
                            onError(div.find("div").first());
                        } else {
                            onError(div.find("input").first());
                        }
                    } else {
                        if (this.data("itemtype") == "object") {
                            div.find("div").first().css({"border-color":""});
                        } else {
                            div.find("input").first().css({"border-color":""});
                        }
                    }
                }

                if (values.length) {
                    return values;
                }
            };

            return div;
        },

        getArrayItem : function(descriptionField) {
            var item = $('<li class="input-group col-sm-12">');

            switch (descriptionField.itemType) {
                case 'text':
                case 'string':
                    var field = Metadata.getTextInput(descriptionField);
                    break;

                case 'name':
                    var field = Metadata.getKeywordInput(descriptionField);
                    break;

                case 'number':
                    var field = Metadata.getNumberInput(descriptionField);
                    break;

                case 'date':
                    var field = Metadata.getDateInput(descriptionField, item);
                    break;

                case 'boolean':
                    var field = Metadata.getRadioInput(descriptionField);
                    break;

                default:
                    if ($.isPlainObject(descriptionField.itemType)) {
                        switch (descriptionField.itemType.type) {
                            case 'object' :
                                var field = Metadata.getObjectDiv(descriptionField.itemType);

                                // Add title to Collapse
                                var objectHeader = $("#object_header_new_text").text().replace(/%1\$s/g, descriptionField.label);
                                header = field.find(".panel-title").first().find("a");
                                header.text(objectHeader);

                                break;
                            case 'array' :
                                var field = Metadata.getArrayDiv(descriptionField.itemType);
                                break;
                        }
                    } else {
                        console.log("Type "+descriptionField.itemType+" of field "+descriptionField.name+" is not managed");
                        return;
                    }
            }

            item.data('field', field);

            item.append(field);

            return item;
        },

        addArrayItem : function(arrayDiv) {
            var itemList = arrayDiv.data('itemlist');
            var descriptionField = arrayDiv.data('description');

            // New empty item
            var div = Metadata.getArrayItem(descriptionField);

            var items = itemList.children("li");
            items.css({'margin-bottom': '0px'});

            if (items.length) {
                var index = items.length;

                previous = items.first();
                previous.find('a').first().text('#'+index);

                // Button to remove item
                if ($.isPlainObject(descriptionField.itemType)) {
                    previous.children().css({'border-color':''});
                    previous.find(".panel-heading").css({ "padding-top": "2px", "padding-bottom": "2px" });
                    previous.find(".panel-collapse").removeClass("in");
                    previous.find(".panel-heading").append('<a href="#" class="btn btn-default removeRowArray" style="display: inline-block;margin-left: 90%;"><i class="fa fa-times text-danger"></i></a>');
                } else {
                    previous.children().css({'border-color':''});
                    previous.attr("oninput", "checkInput(this)");
                    previous.append('<a href="#" class="btn btn-default removeRowArray input-group-addon"><i class="fa fa-times text-danger"></i></a>');
                }
            }

            if(descriptionField.readonly && Metadata.isModification) {
                div.find("input, select").attr("readonly", true);
                div.find("input, select").attr("disabled", true);
                div.find(".btn").addClass("disabled");
                // Disable 'removeRowArray' button
                previous.find(".btn").addClass("disabled");
            }

            div.css({'margin-bottom': '5px'});
            itemList.prepend(div);
            itemList.append(previous);
        },

        addCustomField : function(source, target) {
            // to inititate default value and avoid bug on IE 11
            if (source === undefined) {
                source = "";
            }
            if (target === undefined) {
                target = $("#customFields");
            }
            var formGroup = $('<div class="form-group" />');
            var label = $('<div class="col-md-3"/>');
            var name = $('<input type="text" class="form-control input-sm name" />');
            name.val(source.property);

            label.append(name);
            formGroup.append(label);
            var div = $('<div class="input-group col-md-9" style="padding-left: 15px;"/>');
            formGroup.append(div);

            var field = $('<textarea class="form-control input-sm" rows="1" style="resize: none; resize: vertical; height: 2.5em;" />');
            field.attr('data-type', 'text');
            field.text(source.value);

            var removeButton = $('<a href="#" class="btn btn-default removeField input-group-addon"><i class="fa fa-times text-danger"></i></a>');

            div.append(field);
            div.append(removeButton);

            formGroup.data('name', name);
            formGroup.data('field', field);

            field.getValue = function() {
                return $.trim(this.val());
            };

            target.append(formGroup);
        },

        removeRowArray : function(source) {
            source.closest('li').remove();
        },

        removeField : function(source) {
            source.closest('.form-group').remove();
        },

        serialize : function(target) {
            Metadata.flagEmptyRequiredField = false;
            Metadata.flagEmptyCustomField = false;

            var selectedProfile = $('#archivalProfile').find('option:selected').data('json');
            var formGroups = target.find("#archivalProfileFields").children('div');
            var customFormGroups = target.find("#customFields").children('div');

            var descriptionObject = {};

            $.each(formGroups, function() {
                name = $(this).attr('name');
                field = $(this).data('field');
                value = field.getValue();

                if (value) {
                    descriptionObject[name] = value;
                }
            });
            if (!Metadata.isValid) {
                Metadata.isValid = true;
                Metadata.flagEmptyRequiredField.field = true;
                return -1 ;
            }

            $.each(customFormGroups, function() {
                name = $(this).data('name').val();
                var value = $.trim($(this).find('.value').val());
                field = $(this).data('field');
                value = field.getValue();

                if (value == undefined || value == null || name == ''|| name == undefined || name == null) {
                    $(this).closest(".form-group").addClass('has-error');
                    Metadata.flagEmptyCustomField = true;
                    return;
                } else {
                    $(this).closest(".form-group").removeClass('has-error');
                }

                descriptionObject[name] = value;
            });

            if (Metadata.flagEmptyRequiredField) {
                gritter.show($('#fieldLabel_error').text(), false);

                return -1;
            }
            if (Metadata.flagEmptyCustomField) {
                gritter.show($('#customFieldLabel_error').text(), false);

                return -1;
            }
            return descriptionObject;
        },

        clear : function() {
            $('#archivalProfileFields').empty();
            $('#customFields').empty();
        },

        acceptUserIndex : function(value) {
            if (value) {
                $('#customFields').empty();
                $('#customFieldAddBtn').removeClass("hide");
            } else {
                $('#customFields').empty();
                $('#customFieldAddBtn').addClass("hide");
            }
        },

        fillInMetadata : function(archiveId) {
            $.ajax({
                url         : "/archive/"+archiveId,
                type        : "GET",
                headers     : {"Accept":"application/json"},
                async       : false,
                success     : function (response) {
                    Metadata.archive = response;
                    Metadata.checkAndFill(Metadata.archive, $("#importPanel"));
                },
                error       : function (response) {
                    gritter.show(response.responseText, false);
                }
            });
            $('#modifyArchive').data("archive-id", archiveId);
            $('#modifyArchive').removeClass("hide");
            $("#syncImport").addClass("hide");
            $("#asyncImport").addClass("hide");
            $("#managementMetadataDiv").addClass("hide");
        },

        checkAndFill : function(data, target) {
            if (target.attr("data-type")==="date") {
                field = target.find("input");
                if (field.data('format') == 'datetime') {
                    data = data.replace('T', ' ');
                    field.data('DateTimePicker').date(data)
                    field.data('DateTimePicker').format('YYYY-MM-DD HH:mm:ss');
                } else {
                    data = new Date(data).toLocaleDateString("[?merge locale ?]").replace(/\//g, "-");
                    field.datepicker('setDate', data);
                }
            }

            if (target.attr("data-type")==="name") {
                field = target.find("select, input");
                field.val(data);
            } else if (target.attr("data-type")==="boolean") {
                $.each($(target).find("input"),