28 lines
851 B
HTML
28 lines
851 B
HTML
{% load crispy_forms_field %}
|
|
|
|
<div class="field">
|
|
<div id="div_id_{{ field.name }}" class="file has-name is-fullwidth">
|
|
<label class="file-label">
|
|
{% crispy_field field 'class' 'file-input'%}
|
|
<span class="file-cta">
|
|
<span class="file-icon">
|
|
<i class="fas fa-upload"></i>
|
|
</span>
|
|
<span class="file-label">
|
|
Choose a file…
|
|
</span>
|
|
</span>
|
|
<span class="file-name"></span>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
const fileInput = document.querySelector('#div_id_{{ field.name }} input[type=file]');
|
|
fileInput.onchange = () => {
|
|
if (fileInput.files.length > 0) {
|
|
const fileName = document.querySelector('#div_id_{{ field.name }} .file-name');
|
|
fileName.textContent = fileInput.files[0].name;
|
|
}
|
|
}
|
|
</script> |