Как отобразить имя файла, загруженного после редактирования существующего стиля ввода - PullRequest
Новая
       59

Как отобразить имя файла, загруженного после редактирования существующего стиля ввода

0 голосов
/ 12 апреля 2020

У меня есть две проблемы:

  1. Настройка кнопки choose file и no file chosen текста в то же время ...
  2. Отображение пользователю, какое имя файла было выбрано.

У меня первая часть разобралась. Я получил стиль кнопки choose file, но больше не вижу, какой файл был выбран после выбора. Такое ощущение, что кнопка choose file встроена в отображаемый текст имени файла.

Мой HTML (Haml): 

= form_for @import, url: import_awesome_file_path, multipart: true do |f|
  %label.choose-file-button
    Upload new Property
    = f.file_field :file, type: "file", id: 'imputFile'
    %label{for: "imputFile"} Choose a file

Мой CSS: 

.choose-file-button{
  background-color: #999999;
  color: white;
  padding: 15px 5px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
}

input[type="file"]{
  display: none;
}

Скрывая input[type="file"], он также скрывает имя файла однажды выбранный, и мне действительно было трудно показывать тот, когда выбранный.

Как я могу это сделать?

...