feat(instructeurs import): display submit button only if file uploaded
This commit is contained in:
parent
ec7aea50b3
commit
7af934daf5
2 changed files with 23 additions and 2 deletions
|
@ -8,7 +8,7 @@
|
|||
.notice
|
||||
= t(".csv_import.#{scope}.notice_2_html")
|
||||
|
||||
= form_tag import_admin_procedure_groupe_instructeurs_path(@procedure), method: :post, multipart: true, class: "mt-4 column" do
|
||||
= form_tag import_admin_procedure_groupe_instructeurs_path(@procedure), method: :post, multipart: true, class: "mt-4 column", "data-controller" => "enable-submit-if-uploaded" do
|
||||
%label.fr-label.font-weight-bold
|
||||
= t('.csv_import.file_to_import')
|
||||
.fr-download
|
||||
|
@ -20,4 +20,4 @@
|
|||
= t('.csv_import.file_size_limit', max_file_size: number_to_human_size(csv_max_size))
|
||||
.flex.column
|
||||
= file_field_tag :csv_file, required: true, accept: 'text/csv', size: "1", class: 'fr-mb-2w'
|
||||
= submit_tag t('.csv_import.import_file'), class: 'fr-btn fr-btn--tertiary', data: { disable_with: "Envoi...", confirm: t('.csv_import.import_file_alert') }, disabled: true
|
||||
= submit_tag t('.csv_import.import_file'), class: 'fr-btn fr-btn--tertiary', id: 'submit-button', data: { disable_with: "Envoi...", confirm: t('.csv_import.import_file_alert') }, disabled: true
|
||||
|
|
|
@ -0,0 +1,21 @@
|
|||
import { Controller } from '@hotwired/stimulus';
|
||||
import { enable, disable } from '@utils';
|
||||
|
||||
export class EnableSubmitIfUploadedController extends Controller {
|
||||
connect() {
|
||||
const fileInput = document.querySelector(
|
||||
'input[type="file"]'
|
||||
) as HTMLInputElement;
|
||||
const submitButton = document.getElementById(
|
||||
'submit-button'
|
||||
) as HTMLButtonElement;
|
||||
|
||||
fileInput.addEventListener('change', function () {
|
||||
if (fileInput.files && fileInput.files.length > 0) {
|
||||
enable(submitButton);
|
||||
} else {
|
||||
disable(submitButton);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
Loading…
Reference in a new issue