diff --git a/app/assets/javascripts/exercises.js.erb b/app/assets/javascripts/exercises.js.erb
index 71167533..efe110d2 100644
--- a/app/assets/javascripts/exercises.js.erb
+++ b/app/assets/javascripts/exercises.js.erb
@@ -66,7 +66,6 @@ $(document).on('turbolinks:load', function() {
     $('#files').append(html);
     $('#files li:last select[name*="file_type_id"]').val(getSelectedExecutionEnvironment().file_type_id);
     $('#files li:last select').chosen(window.CodeOcean.CHOSEN_OPTIONS);
-    $('#files li:last select').remove();
     $('#files li:last>div:last').removeClass('in').addClass('show')
     $('body, html').scrollTo('#add-file');
 
diff --git a/app/views/exercises/_file_form.html.slim b/app/views/exercises/_file_form.html.slim
index d85751fc..ffb0def6 100644
--- a/app/views/exercises/_file_form.html.slim
+++ b/app/views/exercises/_file_form.html.slim
@@ -2,13 +2,18 @@
 
 li.card.mt-2
   .card-header role="tab" id="heading"
-    a.file-heading.collapsed data-toggle="collapse" href="#collapse#{id}"
+    - collapsed_class = f.index != 'index' ? 'collapsed' : nil
+    - aria_expanded = f.index != 'index' ? 'false' : 'true'
+    a class=['file-heading', collapsed_class] data-toggle="collapse" href="#collapse#{f.index}" aria-expanded="#{aria_expanded}"
       div.clearfix role="button"
         i class="fa" aria-hidden="true"
-        span = f.object.name
-  .card-collapse.collapse class=('in' if f.object.name.nil?) id="collapse#{id}" role="tabpanel"
+        - if f.object.name.present? && f.object.file_type.present?
+          span = f.object.name_with_extension
+        - else
+          span = f.object.name
+  .card-collapse.collapse class=('in' if f.object.name.nil?) id="collapse#{f.index}" role="tabpanel"
     .card-body
-      - if policy(f.object).destroy?
+      - if policy(f.object).destroy? && id.present?
         .clearfix
           .btn.btn-warning.btn-sm.float-right.delete-file data-file-url=code_ocean_file_path(id) = t('shared.destroy')
       .form-group