Django - Ask users to confirm change of PDF file - django

Question

I got a question regarding Fileupload. I got a form where users can upload PDFs and change the uploaded PDFs. When they change the PDF, I want to add a warning, asking them to confirm the PDF change. Any idea what's the best way of doing it?
Right now, I'm trying to solve it with JS in my HTML, like so:
<form enctype="multipart/form-data" method="post">
{% csrf_token %}
<table>
{{ form.as_table }}
</table>
<input type="submit" value="Submit">
<input class="deleter" type="submit" value="Delete">
{% include "some_html.html" %}
</form>
<script>
// Add event listener to change button
function confirmFileChange() {
var fileInput = document.getElementById('id_file');
fileInput.addEventListener('change', function() {
if (fileInput.value) {
if (!confirm('Are you sure you want to change the uploaded PDF?')) {
fileInput.value = '';
}
}
});
}
if (document.body.innerHTML.indexOf('Change: ') !== -1) {
confirmFileChange();
}
</script>
But this also displays the warning upon first upload, when the user isn't changing anything.

Answer 1

I assume that you render your HTML in the django view with a command like render(request, 'simple_upload.html').
The render command accept as third parameter a context object, where you can store information, that can be used in the template. You have to write in this context, if a PDF is already exists or not.
context = { 'pdf_already_exists': True if pdfAlreadyExists() else False }
render(request, 'simple_upload.html', context)
Now you can evaluate in the template if the PDF already exists.
{% if pdf_already_exists %}
<script>
var fileInput = document.getElementById('id_file');
fileInput.addEventListener('change', function() {
if (fileInput.value) {
if (!confirm('Are you sure you want to change the uploaded PDF?')) {
fileInput.value = '';
}
}
});
</script>
{% endif %}
The script is only rendered in the HTML when a PDF already exists, and the warning can not be displayed upon first upload, when the user isn't changing anything.
I hope that helps.