diff --git a/app/Resources/public/css/base.css b/app/Resources/public/css/base.css
index 288d748679..6fd087e47b 100644
--- a/app/Resources/public/css/base.css
+++ b/app/Resources/public/css/base.css
@@ -5936,3 +5936,26 @@ a.sessionView {
 .elfinder-cwd-filename {
     color: black !important;
 }
+
+
+#dropzone {
+    position: relative;
+    overflow: hidden;
+    direction: ltr;
+    cursor: pointer;
+    text-align: center;
+    color: #333;
+    font-weight: bold;
+    -moz-border-radius: 10px;
+    -webkit-border-radius: 10px;
+    border-radius: 10px;
+    width: auto;
+    margin-left: auto;
+    margin-right: auto;
+    height: auto;
+    line-height: 50px;
+    background-color: #D4E6F0;
+    border: 2px dashed #bbbbbb;
+    font-size: 120%;
+    margin-bottom: 0;
+}
\ No newline at end of file
diff --git a/main/document/upload.php b/main/document/upload.php
index 4269d90cbf..c7213f3e93 100755
--- a/main/document/upload.php
+++ b/main/document/upload.php
@@ -80,8 +80,6 @@ if (empty($document_data)) {
 }
 $group_properties = array();
 
-$url = api_get_path(WEB_AJAX_PATH).'document.ajax.php?'.api_get_cidreq().'&a=upload_file&curdirpath='.$path;
-
 $htmlHeadXtra[] = '<script>
 
 function check_unzip() {
@@ -101,108 +99,6 @@ function setFocus(){
 }
 </script>';
 
-$htmlHeadXtra[] = "
-<script>
-$(function () {
-    'use strict';
-    var url = '".$url."';
-    var uploadButton = $('<button/>')
-        .addClass('btn btn-primary')
-        .prop('disabled', true)
-        .text('".get_lang('Loading')."')
-        .on('click', function () {
-            var \$this = $(this),
-            data = \$this.data();
-
-            \$this
-                .off('click')
-                .text('".get_lang('Cancel')."')
-                .on('click', function () {
-                    \$this.remove();
-                    data.abort();
-                });
-            data.submit().always(function () {
-                \$this.remove();
-            });
-        });
-
-    $('#file_upload').fileupload({
-        url: url,
-        dataType: 'json',
-        autoUpload: false,
-        // Enable image resizing, except for Android and Opera,
-        // which actually support image resizing, but fail to
-        // send Blob objects via XHR requests:
-        disableImageResize: /Android(?!.*Chrome)|Opera/.test(window.navigator.userAgent),
-        previewMaxWidth: 100,
-        previewMaxHeight: 100,
-        previewCrop: true
-     }).on('fileuploadadd', function (e, data) {
-        data.context = $('<div/>').appendTo('#files');
-
-        $.each(data.files, function (index, file) {
-            var node = $('<p/>').append($('<span/>').text(file.name));
-            if (!index) {
-                node
-                    .append('<br>')
-                    .append(uploadButton.clone(true).data(data));
-            }
-            node.appendTo(data.context);
-        });
-    }).on('fileuploadprocessalways', function (e, data) {
-        var index = data.index,
-            file = data.files[index],
-            node = $(data.context.children()[index]);
-        if (file.preview) {
-            node
-                .prepend('<br>')
-                .prepend(file.preview);
-        }
-        if (file.error) {
-            node
-                .append('<br>')
-                .append($('<span class=\"text-danger\"/>').text(file.error));
-        }
-        if (index + 1 === data.files.length) {
-            data.context.find('button')
-                .text('Upload')
-                .prop('disabled', !!data.files.error);
-        }
-    }).on('fileuploadprogressall', function (e, data) {
-        var progress = parseInt(data.loaded / data.total * 100, 10);
-        $('#progress .progress-bar').css(
-            'width',
-            progress + '%'
-        );
-    }).on('fileuploaddone', function (e, data) {
-
-        $.each(data.result.files, function (index, file) {
-            if (file.url) {
-                var link = $('<a>')
-                    .attr('target', '_blank')
-                    .prop('href', file.url);
-
-                $(data.context.children()[index]).wrap(link);
-            } else if (file.error) {
-                var error = $('<span class=\"text-danger\"/>').text(file.error);
-                $(data.context.children()[index])
-                    .append('<br>')
-                    .append(error);
-            }
-        });
-    }).on('fileuploadfail', function (e, data) {
-        $.each(data.files, function (index) {
-            var error = $('<span class=\"text-danger\"/>').text('File upload failed.');
-            $(data.context.children()[index])
-                .append('<br>')
-                .append(error);
-        });
-    }).prop('disabled', !$.support.fileInput)
-        .parent().addClass($.support.fileInput ? undefined : 'disabled');
-
-});
-
-</script>";
 
 // This needs cleaning!
 if (!empty($groupId)) {
@@ -213,7 +109,7 @@ if (!empty($groupId)) {
     // Only courseadmin or group members allowed
     if ($is_allowed_to_edit || GroupManager::is_user_in_group(api_get_user_id(), $groupId)) {
         $interbreadcrumb[] = array(
-            'url' => '../group/group_space.php?'.api_get_cidreq(),
+            'url' => api_get_path(WEB_CODE_PATH).'group/group_space.php?'.api_get_cidreq(),
             'name' => get_lang('GroupSpace'),
         );
     } else {
@@ -284,7 +180,6 @@ $this_section = SECTION_COURSES;
 Display::display_header($nameTools, 'Doc');
 
 /*    Here we do all the work */
-
 $unzip = isset($_POST['unzip']) ? $_POST['unzip'] : null;
 $index = isset($_POST['index_document']) ? $_POST['index_document'] : null;
 // User has submitted a file
@@ -307,14 +202,13 @@ if (!empty($_FILES)) {
 // Link back to the documents overview
 if ($is_certificate_mode) {
     $actions = '<a href="document.php?id='.$document_id.'&selectcat=' . $selectcat.'&'.api_get_cidreq().'">'.
-        Display::return_icon('back.png',get_lang('BackTo').' '.get_lang('CertificateOverview'),'',ICON_SIZE_MEDIUM).'</a>';
+        Display::return_icon('back.png', get_lang('BackTo').' '.get_lang('CertificateOverview'), '', ICON_SIZE_MEDIUM).'</a>';
 } else {
     $actions = '<a href="document.php?id='.$document_id.'&'.api_get_cidreq().'">'.
-        Display::return_icon('back.png',get_lang('BackTo').' '.get_lang('DocumentsOverview'),'',ICON_SIZE_MEDIUM).'</a>';
+        Display::return_icon('back.png', get_lang('BackTo').' '.get_lang('DocumentsOverview'), '', ICON_SIZE_MEDIUM).'</a>';
 }
 
 // Link to create a folder
-
 echo $toolbar = Display::toolbarAction('toolbar-upload', array( 0 => $actions), 1);
 // Form to select directory
 $folders = DocumentManager::get_all_document_folders($_course, $groupId, $is_allowed_to_edit);
@@ -399,33 +293,16 @@ $form->setDefaults($defaults);
 
 $simple_form = $form->returnForm();
 
-$multiple_form = '<div class="description-upload">'.get_lang('ClickToSelectOrDragAndDropMultipleFilesOnTheUploadField').'</div>';
-$multiple_form .=  '
-<span class="btn btn-success fileinput-button">
-    <i class="glyphicon glyphicon-plus"></i>
-    <span>'.get_lang('AddFiles').'</span>
-    <!-- The file input field used as target for the file upload widget -->
-    <input id="file_upload" type="file" name="files[]" multiple>
-</span>
-
-<br />
-<br />
-<!-- The global progress bar -->
-<div id="progress" class="progress">
-    <div class="progress-bar progress-bar-success"></div>
-</div>
-<div id="files" class="files"></div>
-';
-
-$nav_info = api_get_navigator();
-if ($nav_info ['name'] == 'Internet Explorer') {
-    echo $simple_form;
-} else {
-    $headers = array(
-        get_lang('Upload'),
-        get_lang('Upload').' ('.get_lang('Simple').')',
-    );
-    echo Display::tabs($headers, array($multiple_form, $simple_form), 'tabs');
-}
+$url = api_get_path(WEB_AJAX_PATH).'document.ajax.php?'.api_get_cidreq().'&a=upload_file&curdirpath='.$path;
+
+$multipleForm = new FormValidator('post');
+$multipleForm->addMultipleUpload($url);
+
+$headers = array(
+    get_lang('Upload'),
+    get_lang('Upload').' ('.get_lang('Simple').')',
+);
+
+echo Display::tabs($headers, array($multipleForm->returnForm(), $form->returnForm()), 'tabs');
 
 Display::display_footer();
diff --git a/main/dropbox/dropbox_functions.inc.php b/main/dropbox/dropbox_functions.inc.php
index 4944bd0404..1ecd94b9e1 100755
--- a/main/dropbox/dropbox_functions.inc.php
+++ b/main/dropbox/dropbox_functions.inc.php
@@ -719,25 +719,10 @@ function display_add_form($dropbox_unid, $viewReceivedCategory, $viewSentCategor
         )
     );
 
-    $multipleForm->addHtml('
-        <div id="multiple_form" style="display:none">
-        <div class="description-upload">'.get_lang('ClickToSelectOrDragAndDropMultipleFilesOnTheUploadField').'</div>
-            <span class="btn btn-success fileinput-button">
-                <i class="glyphicon glyphicon-plus"></i>
-                <span>'.get_lang('AddFiles').'</span>
-                <!-- The file input field used as target for the file upload widget -->
-                <input id="input_fileupload" type="file" name="files[]" multiple>
-            </span>
-
-            <br />
-            <br />
-            <!-- The global progress bar -->
-            <div id="progress" class="progress">
-                <div class="progress-bar progress-bar-success"></div>
-            </div>
-            <div id="files" class="files"></div>
-        </div>
-    ');
+    $url = api_get_path(WEB_AJAX_PATH).'dropbox.ajax.php?'.api_get_cidreq().'&a=upload_file&id=';
+    $multipleForm->addHtml('<div id="multiple_form" style="display:none">');
+    $multipleForm->addMultipleUpload($url);
+    $multipleForm->addHtml('</div>');
 
     echo Display::tabs($headers, array($multipleForm->returnForm(), $form->returnForm()), 'tabs');
 }
diff --git a/main/dropbox/dropbox_init.inc.php b/main/dropbox/dropbox_init.inc.php
index 820bb2850b..2544f7c367 100755
--- a/main/dropbox/dropbox_init.inc.php
+++ b/main/dropbox/dropbox_init.inc.php
@@ -287,133 +287,20 @@ Session::write('javascript', $javascript);
 $htmlHeadXtra[] = '<meta http-equiv="cache-control" content="no-cache">
 	<meta http-equiv="pragma" content="no-cache">
 	<meta http-equiv="expires" content="-1">';
-
-
-$checked_files = false;
-if (!$view || $view == 'received') {
-	$part = 'received';
-} elseif ($view = 'sent') {
-	$part = 'sent';
-    $htmlHeadXtra[] = api_get_jquery_libraries_js(array('jquery-ui', 'jquery-upload'));
-    $url = api_get_path(WEB_AJAX_PATH).'dropbox.ajax.php?'.api_get_cidreq().'&a=upload_file&id=';
-
-    $htmlHeadXtra[] = "<script>
+$htmlHeadXtra[] = api_get_jquery_libraries_js(array('jquery-ui', 'jquery-upload'));
+$htmlHeadXtra[] = "<script>
 $(function () {
-    'use strict';
-    var url = '".$url."';
-    var uploadButton = $('<button/>')
-        .addClass('btn btn-primary')
-        .prop('disabled', true)
-        .text('".get_lang('Loading')."')
-        .on('click', function () {
-            var \$this = $(this),
-            data = \$this.data();
-
-            \$this
-                .off('click')
-                .text('".get_lang('Cancel')."')
-                .on('click', function () {
-                    \$this.remove();
-                    data.abort();
-                });
-            data.submit().always(function () {
-
-                \$this.remove();
-            });
-    });
-
     $('#recipient_form').on('change', function() {
         $('#multiple_form').show();
     });
-
-    $('#fileupload').bind('fileuploaddone', function (e, data) {
-      console.log('fileuploaddone');
-        event.preventDefault();
-        return false;
-    });
-
-    $('#fileupload').submit(function() {
-    return false;
-    });
-
-    $('#fileupload').fileupload({
-        url: url,
-        dataType: 'json',
-        autoUpload: false,
-        // Enable image resizing, except for Android and Opera,
-        // which actually support image resizing, but fail to
-        // send Blob objects via XHR requests:
-        disableImageResize: /Android(?!.*Chrome)|Opera/.test(window.navigator.userAgent),
-        previewMaxWidth: 100,
-        previewMaxHeight: 100,
-        previewCrop: true,
-        complete: function (e, data) {
-        }
-    }).on('fileuploadadd', function (e, data) {
-        data.context = $('<div/>').appendTo('#files');
-
-        $.each(data.files, function (index, file) {
-            var node = $('<p/>').append($('<span/>').text(file.name));
-            if (!index) {
-                node
-                    .append('<br>')
-                    .append(uploadButton.clone(true).data(data));
-            }
-            node.appendTo(data.context);
-        });
-    }).on('fileuploadprocessalways', function (e, data) {
-        var index = data.index,
-            file = data.files[index],
-            node = $(data.context.children()[index]);
-        if (file.preview) {
-            node
-                .prepend('<br>')
-                .prepend(file.preview);
-        }
-        if (file.error) {
-            node
-                .append('<br>')
-                .append($('<span class=\"text-danger\"/>').text(file.error));
-        }
-        if (index + 1 === data.files.length) {
-            data.context.find('button')
-                .text('Upload')
-                .prop('disabled', !!data.files.error);
-        }
-    }).on('fileuploadprogressall', function (e, data) {
-        var progress = parseInt(data.loaded / data.total * 100, 10);
-        $('#progress .progress-bar').css(
-            'width',
-            progress + '%'
-        );
-    }).on('fileuploaddone', function (e, data) {
-        $.each(data.result.files, function (index, file) {
-            if (file.url) {
-                var link = $('<a>')
-                    //.attr('target', '_blank')
-                    .prop('href', file.url);
-
-                $(data.context.children()[index]).wrap(link);
-            } else if (file.error) {
-                var error = $('<span class=\"text-danger\"/>').text(file.error);
-                $(data.context.children()[index])
-                    .append('<br>')
-                    .append(error);
-            }
-        });
-    }).on('fileuploadfail', function (e, data) {
-        $.each(data.files, function (index) {
-            var error = $('<span class=\"text-danger\"/>').text('File upload failed.');
-            $(data.context.children()[index])
-                .append('<br>')
-                .append(error);
-        });
-    }).prop('disabled', !$.support.fileInput)
-        .parent().addClass($.support.fileInput ? undefined : 'disabled');
-
 });
-
 </script>";
+$checked_files = false;
+if (!$view || $view == 'received') {
+	$part = 'received';
+} elseif ($view = 'sent') {
+	$part = 'sent';
+
 
 } else {
 	header('location: index.php?view='.$view.'&error=Error');
diff --git a/main/forum/forumfunction.inc.php b/main/forum/forumfunction.inc.php
index fdcd6ac0a5..92138280b9 100755
--- a/main/forum/forumfunction.inc.php
+++ b/main/forum/forumfunction.inc.php
@@ -48,33 +48,7 @@ function setFocus() {
 }
 </script>';
 // The next javascript script is to manage ajax upload file
-$htmlHeadXtra[] = "<script>
-$(function () {
-    setFocus();
-    $('#file_upload').fileUploadUI({
-        uploadTable:   $('.files'),
-        downloadTable: $('.files'),
-        buildUploadRow: function (files, index) {
-            $('.files').closest('.control-group').show();
-            return $('<tr><td>' + files[index].name + '<\/td>' +
-                    '<td class=\"file_upload_progress\"><div><\/div><\/td>' +
-                    '<td class=\"file_upload_cancel\">' +
-                    '<button class=\"ui-state-default ui-corner-all\" title=\"".get_lang('Cancel')."\">' + '<span class=\"ui-icon ui-icon-cancel\">".get_lang('Cancel')."<\/span>' +'<\/button>'+
-                    '<\/td><\/tr>');
-        },
-        buildDownloadRow: function (file) {
-            if (!file.error) {
-                return $('<tr id=' + file.id + ' ><td>' + file.name + '<\/td><td>' + file.size + '<\/td><td>&nbsp;' + file.result +
-                    ' <\/td><td> <input style=\"width:90%;\" type=\"text\" value=\"' + file.comment + '\" name=\"file_comments[]\"> <\/td><td>' +
-                    file.delete + '<\/td>' +
-                    '<input type=\"hidden\" value=\"' + file.id +'\" name=\"file_ids[]\">' + '<\/tr>');
-            } else {
-                alert('" . get_lang('UploadError') . "');
-            }
-        }
-    });
-});
-</script>";
+$htmlHeadXtra[] = api_get_jquery_libraries_js(array('jquery-ui', 'jquery-upload'));
 
 // Recover Thread ID, will be used to generate delete attachment URL to do ajax
 $threadId = isset($_REQUEST['thread']) ? intval($_REQUEST['thread']) : 0;
@@ -82,30 +56,30 @@ $forumId = isset($_REQUEST['forum']) ? intval($_REQUEST['forum']) : 0;
 
 // The next javascript script is to delete file by ajax
 $htmlHeadXtra[] = '<script>
-    $(function () {
-        $(document).on("click", ".deleteLink", function(e) {
-            e.preventDefault();
-            e.stopPropagation();
-            var l = $(this);
-            var id = l.closest("tr").attr("id");
-            var filename = l.closest("tr").find(".attachFilename").html();
-            if (confirm("' . get_lang('AreYouSureToDeleteJS') . '", filename)) {
-                $.ajax({
-                    type: "POST",
-                    url: "'.api_get_path(WEB_AJAX_PATH) . 'forum.ajax.php?'.api_get_cidreq().'&a=delete_file&attachId=" + id +"&thread='.$threadId .'&forum='.$forumId .'",
-                    dataType: "json",
-                    success: function(data) {
-                        if (data.error == false) {
-                            l.closest("tr").remove();
-                            if ($(".files td").length < 1) {
-                                $(".files").closest(".control-group").hide();
-                            }
+$(function () {
+    $(document).on("click", ".deleteLink", function(e) {
+        e.preventDefault();
+        e.stopPropagation();
+        var l = $(this);
+        var id = l.closest("tr").attr("id");
+        var filename = l.closest("tr").find(".attachFilename").html();
+        if (confirm("' . get_lang('AreYouSureToDeleteJS') . '", filename)) {
+            $.ajax({
+                type: "POST",
+                url: "'.api_get_path(WEB_AJAX_PATH) . 'forum.ajax.php?'.api_get_cidreq().'&a=delete_file&attachId=" + id +"&thread='.$threadId .'&forum='.$forumId .'",
+                dataType: "json",
+                success: function(data) {
+                    if (data.error == false) {
+                        l.closest("tr").remove();
+                        if ($(".files td").length < 1) {
+                            $(".files").closest(".control-group").hide();
                         }
                     }
-                })
-            }
-        });
+                }
+            })
+        }
     });
+});
 </script>';
 
 /**
@@ -5577,7 +5551,9 @@ function editAttachedFile($array, $id, $courseId = null) {
  * @param int $forumId Forum ID from where the post are
  * @param int $threadId Thread ID where forum post are
  * @param int $postId Post ID to identify Post
+ * @deprecated this function seems to never been used
  * @return string The Forum Attachment Ajax Form
+ *
  */
 function getAttachmentAjaxForm($forumId, $threadId, $postId)
 {
@@ -5591,18 +5567,11 @@ function getAttachmentAjaxForm($forumId, $threadId, $postId)
     }
 
     $url = api_get_path(WEB_AJAX_PATH).'forum.ajax.php?'.api_get_cidreq().'&forum=' . $forumId . '&thread=' . $threadId . '&postId=' . $postId . '&a=upload_file';
-    // Form
-    $formFileUpload = '<div class="form-ajax">
-        <form id="file_upload" action="'.$url.'" method="POST" enctype="multipart/form-data">
-            <input type="file" name="user_upload" multiple>
-            <button type="submit">Upload</button>
-            <div class="button-load">
-                '.get_lang('UploadFiles').'
-            </div>
-        </form></div>
-        ';
-
-    return $formFileUpload;
+
+    $multipleForm = new FormValidator('post');
+    $multipleForm->addMultipleUpload($url);
+
+    return $multipleForm->returnForm();
 }
 
 /**
diff --git a/main/inc/ajax/forum.ajax.php b/main/inc/ajax/forum.ajax.php
index a620d99b80..41501e755e 100644
--- a/main/inc/ajax/forum.ajax.php
+++ b/main/inc/ajax/forum.ajax.php
@@ -38,27 +38,25 @@ if (!empty($action)) {
                 // 3. if anonymous posts are not allowed
                 // The only exception is the course manager
                 // They are several pieces for clarity.
-                if (!api_is_allowed_to_edit(null, true) AND
+                if (!api_is_allowed_to_edit(null, true) &&
                     (
-                        ($current_forum_category && $current_forum_category['visibility'] == 0) OR
+                        ($current_forum_category && $current_forum_category['visibility'] == 0) ||
                         $current_forum['visibility'] == 0
                     )
                 ) {
                     $json['errorMessage'] = '1. the forum category, forum or thread is invisible (visibility==0)';
                     break;
                 }
-                if (!api_is_allowed_to_edit(null, true) AND
+                if (!api_is_allowed_to_edit(null, true) &&
                     (
-                        ($current_forum_category && $current_forum_category['locked'] <> 0) OR
-                        $current_forum['locked'] <> 0 OR $current_thread['locked'] <> 0
+                        ($current_forum_category && $current_forum_category['locked'] <> 0) ||
+                        $current_forum['locked'] <> 0 || $current_thread['locked'] <> 0
                     )
                 ) {
                     $json['errorMessage'] = '2. the forum category, forum or thread is locked (locked <>0)';
                     break;
                 }
-                if (api_is_anonymous() AND
-                    $current_forum['allow_anonymous'] == 0
-                ) {
+                if (api_is_anonymous() && $current_forum['allow_anonymous'] == 0) {
                     $json['errorMessage'] = '3. if anonymous posts are not allowed';
                     break;
                 }
diff --git a/main/inc/lib/formvalidator/FormValidator.class.php b/main/inc/lib/formvalidator/FormValidator.class.php
index 839e082cd9..6b8a76d79f 100755
--- a/main/inc/lib/formvalidator/FormValidator.class.php
+++ b/main/inc/lib/formvalidator/FormValidator.class.php
@@ -454,7 +454,7 @@ EOT;
      * @param array $attributes Additional attributes
      * @return HTML_QuickForm_button
      */
-    public function addButtonNext($label, $name = 'submit',$attributes = array())
+    public function addButtonNext($label, $name = 'submit', $attributes = array())
     {
         return $this->addButton($name, $label, 'arrow-right', 'primary', null, null, $attributes);
     }
@@ -723,8 +723,14 @@ EOT;
      *
      * @return HTML_QuickForm_element
      */
-    public function addSelectFromCollection($name, $label, $collection, $attributes = array(), $addNoneOption = false, $textCallable = '')
-    {
+    public function addSelectFromCollection(
+        $name,
+        $label,
+        $collection,
+        $attributes = array(),
+        $addNoneOption = false,
+        $textCallable = ''
+    ) {
         $options = [];
 
         if ($addNoneOption) {
@@ -1102,7 +1108,7 @@ EOT;
      * A trim-filter is attached to the field.
      * @param string $name The element name
      * @param string $label The label for the form-element
-     * @param bool $required	Optional. Is the form-element required (default=true)
+     * @param bool $required Optional. Is the form-element required (default=true)
      * @param array $attributes Optional. List of attributes for the form-element
      */
     public function addTextLettersOnly(
@@ -1110,8 +1116,7 @@ EOT;
         $label,
         $required = false,
         $attributes = []
-    )
-    {
+    ) {
         $attributes = array_merge(
             $attributes,
             [
@@ -1149,7 +1154,7 @@ EOT;
      * A trim-filter is attached to the field.
      * @param string $name The element name
      * @param string $label The label for the form-element
-     * @param bool $required	Optional. Is the form-element required (default=true)
+     * @param bool $required Optional. Is the form-element required (default=true)
      * @param array $attributes Optional. List of attributes for the form-element
      */
     public function addTextAlphanumeric(
@@ -1157,8 +1162,7 @@ EOT;
         $label,
         $required = false,
         $attributes = []
-    )
-    {
+    ) {
         $attributes = array_merge(
             $attributes,
             [
@@ -1196,7 +1200,7 @@ EOT;
      * A trim-filter is attached to the field.
      * @param string $name The element name
      * @param string $label The label for the form-element
-     * @param bool $required	Optional. Is the form-element required (default=true)
+     * @param bool $required Optional. Is the form-element required (default=true)
      * @param array $attributes Optional. List of attributes for the form-element
      */
     public function addTextLettersAndSpaces(
@@ -1204,8 +1208,7 @@ EOT;
         $label,
         $required = false,
         $attributes = []
-    )
-    {
+    ) {
         $attributes = array_merge(
             $attributes,
             [
@@ -1243,7 +1246,7 @@ EOT;
      * A trim-filter is attached to the field.
      * @param string $name The element name
      * @param string $label The label for the form-element
-     * @param bool $required	Optional. Is the form-element required (default=true)
+     * @param bool $required Optional. Is the form-element required (default=true)
      * @param array $attributes Optional. List of attributes for the form-element
      */
     public function addTextAlphanumericAndSpaces(
@@ -1251,8 +1254,7 @@ EOT;
         $label,
         $required = false,
         $attributes = []
-    )
-    {
+    ) {
         $attributes = array_merge(
             $attributes,
             [
@@ -1285,6 +1287,161 @@ EOT;
         );
     }
 
+    /**
+     * @param string $url
+     */
+    public function addMultipleUpload($url)
+    {
+        $inputName = 'input_file_upload';
+        $this->addMultipleUploadJavascript($url, $inputName);
+
+        $this->addHtml('
+            <div class="description-upload">'.get_lang('ClickToSelectOrDragAndDropMultipleFilesOnTheUploadField').'</div>
+            <span class="btn btn-success fileinput-button">
+                <i class="glyphicon glyphicon-plus"></i>
+                <span>'.get_lang('AddFiles').'</span>
+                <!-- The file input field used as target for the file upload widget -->
+                <input id="'.$inputName.'" type="file" name="files[]" multiple>
+            </span>
+            <br />
+            <br />
+            <div id="dropzone">
+                <div class="button-load">
+                '.get_lang('UploadFiles').'
+                </div>
+            </div>
+
+            <br />
+            <!-- The global progress bar -->
+            <div id="progress" class="progress">
+                <div class="progress-bar progress-bar-success"></div>
+            </div>
+            <div id="files" class="files"></div>
+        ');
+    }
+
+    /**
+     *
+     * @param string $url page that will handle the upload
+     * @param string $inputName
+     */
+    private function addMultipleUploadJavascript($url, $inputName)
+    {
+        $this->addHtml("
+        <script>
+        $(function () {
+            'use strict';
+
+            $('#".$this->getAttribute('id')."').submit(function(){
+                return false;
+            });
+
+            $('#dropzone').on('click', function() {
+                $('#".$inputName."').click();
+            });
+
+            var url = '".$url."';
+            var uploadButton = $('<button/>')
+                .addClass('btn btn-primary')
+                .prop('disabled', true)
+                .text('".get_lang('Loading')."')
+                .on('click', function () {
+                    var \$this = $(this),
+                    data = \$this.data();
+
+                    \$this
+                        .off('click')
+                        .text('".get_lang('Cancel')."')
+                        .on('click', function () {
+                            \$this.remove();
+                            data.abort();
+                        });
+                    data.submit().always(function () {
+                        \$this.remove();
+                    });
+                });
+
+            $('#".$inputName."').fileupload({
+                url: url,
+                dataType: 'json',
+                autoUpload: false,
+                // Enable image resizing, except for Android and Opera,
+                // which actually support image resizing, but fail to
+                // send Blob objects via XHR requests:
+                disableImageResize: /Android(?!.*Chrome)|Opera/.test(window.navigator.userAgent),
+                previewMaxWidth: 100,
+                previewMaxHeight: 100,
+                previewCrop: true,
+                dropzone: $('#dropzone')
+             }).on('fileuploadadd', function (e, data) {
+                data.context = $('<div/>').appendTo('#files');
+
+                $.each(data.files, function (index, file) {
+                    var node = $('<p/>').append($('<span/>').text(file.name));
+                    if (!index) {
+                        node
+                            .append('<br>')
+                            .append(uploadButton.clone(true).data(data));
+                    }
+                    node.appendTo(data.context);
+                });
+            }).on('fileuploadprocessalways', function (e, data) {
+                var index = data.index,
+                    file = data.files[index],
+                    node = $(data.context.children()[index]);
+                if (file.preview) {
+                    node
+                        .prepend('<br>')
+                        .prepend(file.preview);
+                }
+                if (file.error) {
+                    node
+                        .append('<br>')
+                        .append($('<span class=\"text-danger\"/>').text(file.error));
+                }
+                if (index + 1 === data.files.length) {
+                    data.context.find('button')
+                        .text('Upload')
+                        .prop('disabled', !!data.files.error);
+                }
+            }).on('fileuploadprogressall', function (e, data) {
+                var progress = parseInt(data.loaded / data.total * 100, 10);
+                $('#progress .progress-bar').css(
+                    'width',
+                    progress + '%'
+                );
+            }).on('fileuploaddone', function (e, data) {
+
+                $.each(data.result.files, function (index, file) {
+                    if (file.url) {
+                        var link = $('<a>')
+                            .attr('target', '_blank')
+                            .prop('href', file.url);
+
+                        $(data.context.children()[index]).wrap(link);
+                    } else if (file.error) {
+                        var error = $('<span class=\"text-danger\"/>').text(file.error);
+                        $(data.context.children()[index])
+                            .append('<br>')
+                            .append(error);
+                    }
+                });
+            }).on('fileuploadfail', function (e, data) {
+                $.each(data.files, function (index) {
+                    var error = $('<span class=\"text-danger\"/>').text('".get_lang('Failed')."');
+                    $(data.context.children()[index])
+                        .append('<br>')
+                        .append(error);
+                });
+            }).prop('disabled', !$.support.fileInput)
+                .parent().addClass($.support.fileInput ? undefined : 'disabled');
+
+            $('.fileinput-button').hide();
+
+        });
+        </script>"
+        );
+    }
 }
 
 /**
@@ -1328,5 +1485,6 @@ function html_filter_student_fullpage($html)
 function mobile_phone_number_filter($mobilePhoneNumber)
 {
     $mobilePhoneNumber = str_replace(array('+', '(', ')'), '', $mobilePhoneNumber);
-    return ltrim($mobilePhoneNumber,'0');
+
+    return ltrim($mobilePhoneNumber, '0');
 }
diff --git a/main/work/upload.php b/main/work/upload.php
index 73a3b37621..ce7a292ea5 100755
--- a/main/work/upload.php
+++ b/main/work/upload.php
@@ -120,108 +120,6 @@ $url = api_get_path(WEB_AJAX_PATH).'work.ajax.php?'.api_get_cidreq().'&a=upload_
 
 $htmlHeadXtra[] = api_get_jquery_libraries_js(array('jquery-ui', 'jquery-upload'));
 $htmlHeadXtra[] = to_javascript_work();
-$htmlHeadXtra[] = "<script>
-$(function () {
-    'use strict';
-    var url = '".$url."';
-    var uploadButton = $('<button/>')
-        .addClass('btn btn-primary')
-        .prop('disabled', true)
-        .text('".get_lang('Loading')."')
-        .on('click', function () {
-            var \$this = $(this),
-            data = \$this.data();
-
-            \$this
-                .off('click')
-                .text('".get_lang('Cancel')."')
-                .on('click', function () {
-                    \$this.remove();
-                    data.abort();
-                });
-            data.submit().always(function () {
-                \$this.remove();
-            });
-        });
-
-    $('#file_upload').fileupload({
-        url: url,
-        dataType: 'json',
-        autoUpload: false,
-        // Enable image resizing, except for Android and Opera,
-        // which actually support image resizing, but fail to
-        // send Blob objects via XHR requests:
-        disableImageResize: /Android(?!.*Chrome)|Opera/.test(window.navigator.userAgent),
-        previewMaxWidth: 100,
-        previewMaxHeight: 100,
-        previewCrop: true
-     }).on('fileuploadadd', function (e, data) {
-        data.context = $('<div/>').appendTo('#files');
-
-        $.each(data.files, function (index, file) {
-            var node = $('<p/>').append($('<span/>').text(file.name));
-            if (!index) {
-                node
-                    .append('<br>')
-                    .append(uploadButton.clone(true).data(data));
-            }
-            node.appendTo(data.context);
-        });
-    }).on('fileuploadprocessalways', function (e, data) {
-        var index = data.index,
-            file = data.files[index],
-            node = $(data.context.children()[index]);
-        if (file.preview) {
-            node
-                .prepend('<br>')
-                .prepend(file.preview);
-        }
-        if (file.error) {
-            node
-                .append('<br>')
-                .append($('<span class=\"text-danger\"/>').text(file.error));
-        }
-        if (index + 1 === data.files.length) {
-            data.context.find('button')
-                .text('Upload')
-                .prop('disabled', !!data.files.error);
-        }
-    }).on('fileuploadprogressall', function (e, data) {
-        var progress = parseInt(data.loaded / data.total * 100, 10);
-        $('#progress .progress-bar').css(
-            'width',
-            progress + '%'
-        );
-    }).on('fileuploaddone', function (e, data) {
-
-        $.each(data.result.files, function (index, file) {
-            if (file.url) {
-                var link = $('<a>')
-                    .attr('target', '_blank')
-                    .prop('href', file.url);
-
-                $(data.context.children()[index]).wrap(link);
-            } else if (file.error) {
-                var error = $('<span class=\"text-danger\"/>').text(file.error);
-                $(data.context.children()[index])
-                    .append('<br>')
-                    .append(error);
-            }
-        });
-    }).on('fileuploadfail', function (e, data) {
-        $.each(data.files, function (index) {
-            var error = $('<span class=\"text-danger\"/>').text('File upload failed.');
-            $(data.context.children()[index])
-                .append('<br>')
-                .append(error);
-        });
-    }).prop('disabled', !$.support.fileInput)
-        .parent().addClass($.support.fileInput ? undefined : 'disabled');
-
-});
-
-</script>";
-
 Display :: display_header(null);
 
 $headers = array(
@@ -229,25 +127,10 @@ $headers = array(
     get_lang('Upload').' ('.get_lang('Simple').')',
 );
 
-$multiple_form = '<div class="description-upload">'.get_lang('ClickToSelectOrDragAndDropMultipleFilesOnTheUploadField').'</div>';
-$multiple_form .=  '
-<span class="btn btn-success fileinput-button">
-    <i class="glyphicon glyphicon-plus"></i>
-    <span>'.get_lang('AddFiles').'</span>
-    <!-- The file input field used as target for the file upload widget -->
-    <input id="file_upload" type="file" name="files[]" multiple>
-</span>
-
-<br />
-<br />
-<!-- The global progress bar -->
-<div id="progress" class="progress">
-    <div class="progress-bar progress-bar-success"></div>
-</div>
-<div id="files" class="files"></div>
-';
+$multipleForm = new FormValidator('post');
+$multipleForm->addMultipleUpload($url);
 
-$tabs = Display::tabs($headers, array($multiple_form, $form->returnForm()), 'tabs');
+$tabs = Display::tabs($headers, array($multipleForm->returnForm(), $form->returnForm()), 'tabs');
 
 if (!empty($work_id)) {
     echo $validationStatus['message'];