Uploading 2 single files on a form using separate inputs: Django - django

Question

I'm trying to build an application that asks users to upload 2 different pdf files, each from a separate input button/area. I'm new to Django and through reading the documentation a bunch of times I've gotten a few things to work.
Using <form method="post" enctype="multipart/form-data"> I was able to get 2 fields for input which look something like this: App Screenshot of 2 input areas.
However, when I click the select button in either case and select the file and click 'Upload', The same 2 files show up in both input areas. I've experimented with this alot and can't seem to find any resources that attempt to solve my problems.
Quick note: I know there are ways to upload multiple files in a single input area, but I don't want to do that. I want to specifically have 2 different input areas as a design decision.
I'm not sure if this even close to the right approach or if there are better tools for handling this type of situation. Below are chunks of the code I've written. If anyone could give me advice on how to better approach this problem or tell me how to fix my code it would be much appreciated.
Thanks!
forms.py
class FilePDFForm(forms.ModelForm):
class Meta:
model = FilePDF
fields = ('identifier', 'pdf', 'pdf2' )
models.py
class FilePDF(models.Model):
identifier = models.CharField(max_length=50, blank = True)
pub_date = models.DateTimeField(auto_now_add=True)
pdf = models.FileField(upload_to='documents/')
pdf2 = models.FileField(upload_to='documents/')
def __str__(self):
return self.pdf.name + ',' + self.pdf2.name
views.py
def index(request):
if request.method == 'POST' and request.FILES['myfile'] and request.FILES['myfile2']:
genfile = request.FILES['myfile']
genfile2 = request.FILES['myfile2']
fs = FileSystemStorage()
filename = fs.save(genfile.name, genfile)
filename2 = fs.save(genfile2.name, genfile2)
uploaded_file_url = fs.url(filename)
uploaded_file2_url = fs.url(filename2)
file1_uploaded = True
return render(request, '...index.html', {
'uploaded_file_url': uploaded_file_url,
'uploaded_file2_url': uploaded_file2_url,
'file1_name': filename,
'file2_name': filename2
})
return render(request, '...index.html')
index.html
<div class="col-xs-3">
<div class="form-group">
<label class="control-label">Please select the first PDF file from your
computer.</label> <input type="file" class="filestyle" name="myfile"
data-buttontext=" Select" data-buttonname="btn btn-primary" /><br />
<label class="control-label">Please select the second PDF file from your
computer.</label> <input type="file" class="filestyle" name="myfile2"
data-buttontext=" Select" data-buttonname="btn btn-primary" /> <button type=
"submit" class="btn btn-primary">Upload</button>
</div>
</div>

Answer 1

Change your view like this form,
def index(request):
if request.method == 'POST':
f = FilePDFForm(request.POST, request.FILES)
if f.is_valid():
new_object = f.save()
# do remaining thing here
-----------------
return render(request, '...index.html')
for more refer this https://docs.djangoproject.com/en/1.11/topics/forms/modelforms/#modelform