Используйте javascript, чтобы захватить имя файла, выбранного в Rails form_for file_field, перед отправкой

Question

Я пишу код, чтобы запустить всплывающее окно js, которое потребует от пользователя подтверждения, прежде чем они совершают определенное деструктивное действие, перезаписав данные с помощью рельсов form_for. У меня уже есть js popup и какая-то другая логика, моя последняя оставшаяся задача в том, что я хочу, чтобы этот js popup активировал , если файл был прикреплен в определенном file_field на форме. Если на этом файле нет файла file_field, мне это не нужно всплывать.

Как я могу захватить статус того, есть ли в данный момент прикрепленный файл/имя файла? Вот мой текущий соответствующий код. Синтаксис Худой:

Форма выпуска: Соответствующий file_field раздел

tr 
    = f.fields_for :location_csv, LocationCSV.new do |p| 
    td = p.label :attachment, "#{@campaign.form_attributes[:location_csv][:label]}" 
    td.csv-example 
     - if @campaign.has_entrants_with_locations? 
     p.alert Warning: Updating Will Delete Location Information For Past Completed Entries 
     = p.file_field :attachment, accept: "text/csv", class: 'form-control' 

Форма выпуска: Отправить Раздел кнопки, включая какой-либо другой логики

tr 
    td colspan='2'= f.submit class: "button success", id: "btn-form-submit", onclick: "destructionWarning(#{@campaign.has_entrants_with_locations?})" 

Javascript Отрывок

function destructionWarning(status) { 
    if (status === true) { 
    if (confirm("WARNING: This update will delete the store location data for #{@campaign.entrants_with_locations_count} campaign entrant#{'s' if @campaign.entrants_with_locations_count > 1}! Cancel to abort.") == true) {} 
    else { 
     event.preventDefault(); 
    } 
    } 
} 

EDIT: Вот мой обновляемые Фрагмент кода JavaScript:

var csvElement = document.getElementById("quiz_campaign_location_csv_attributes_attachment"); 
var csvAttachment = csvElement.value; 

function destructionWarning(status) { 
    if (status === true && csvAttachment != "") { 
    if (confirm("WARNING: This update will delete the store location data for #{@campaign.entrants_with_locations_count} campaign entrant#{'s' if @campaign.entrants_with_locations_count > 1}! Cancel to abort.") == true) {} 
    else { 
    event.preventDefault(); 
    } 
    } 
} 

Answer 1

Что такое HTML идентификатор элемента ввода поля файл? Вы должны иметь возможность проверить значение ввода для пустой строки.

Предположим, что идентификатор идентификатора элемента ввода файла - attachment.

Использование простой Javascript:

var file_input = document.getElementById("attachment"); 
var filename = file_input.value; 
if(filename != "") { 
    // There is a file specified 
} else { 
    // There is no file specified 
} 

Использование JQuery:

if($('#attachment').val() != "") { 
    // There is a file specified 
} else { 
    // There is no file specified 
} 

Если вы хотите проверить на наличие имени файла в вашей destructionWarning функции:

function destructionWarning(server_status) { 
    if (server_status == true) { 
    var file_input = document.getElementById("attachment"); 
    var filename = file_input.value; 
    if(filename != "") { // user has attached a file 
     var user_confirmed = confirm("WARNING: This update will delete the store location data for #{@campaign.entrants_with_locations_count} campaign entrant#{'s' if @campaign.entrants_with_locations_count > 1}! Cancel to abort."); 
     if (user_confirmed != true) { 
     // cancel the form submission 
     event.preventDefault(); 
     } 
    } 
    } 
}