Calling a Django-Rest API from a Django Form

I built a Django-Rest API with an APIView that uploads a file to a folder of a web server.

This API is working with Postman as shown in the pictures below:

Now, I am working on calling this API from the below HTML form:

Issue I am facing: the file sent via the form returns the following error:

"file": [
    "No file was submitted."
]

Probably something related with the binding of the file as the file is uploaded in the form but not sent to the API.

Below the code of my application:

index.html

<form action="/file/upload/" method="post" enctype="multipart/form-data">
  {% csrf_token %}
  {{ form.as_p }}
  <input id="audio_file" type="file"/>
  <input type="submit" value="Upload File" name="submit"/>
</form>

views.py

class IndexView(TemplateView):
    template_name = "index.html"
    log = logging.getLogger(__name__)
    log.debug("Debug testing")

    def post(self, request): # TODO: fix, empty file error returned after calling post method
        # if this is a POST request we need to process the form data
        if request.method == 'POST':
            # create a form instance and populate it with data from the request:
            # https://docs.djangoproject.com/en/2.2/ref/forms/api/#binding-uploaded-files
            form = FileForm(request.POST, request.FILES)
            # check whether it's valid:
            if form.is_valid():
                instance = form.save(commit=False)
                instance.save()
                # redirect to the same URL:
                return HttpResponseRedirect('/App/index/')
        # if a GET (or any other method) we'll create a blank form
        else:
            form = FileForm()
        return render(request, 'index.html', {'form': form})


class FileView(views.APIView):
    parser_classes = (MultiPartParser, FormParser)

    def post(self, request):
        '''This method is used to Make POST requests to save a file in the media folder'''
        file_serializer = FileSerializer(data=request.data)
        if file_serializer.is_valid():
            file_serializer.save()
            return Response(file_serializer.data, status=status.HTTP_201_CREATED)
        else:
            return Response(file_serializer.errors, status=status.HTTP_400_BAD_REQUEST)

models.py

from django.db import models


class FileModel(models.Model):
    file = models.FileField()
    timestamp = models.DateTimeField(auto_now_add=True)

forms.py

from django.forms import ModelForm
from App.models import FileModel


class FileForm(ModelForm):
    # Creating a form that maps to the model: https://docs.djangoproject.com/en/2.2/topics/forms/modelforms/
    class Meta:
        model = FileModel
        fields = ['file']

Below the documentation I have already consulted without success:

• https://docs.djangoproject.com/en/2.2/topics/http/file-uploads/
• https://docs.djangoproject.com/en/2.2/topics/forms/

These are the stackoverflow questions I already read without finding a solution to the issue:

• Django Contact Form Attachment showing 'This field is required.' What am I doing Wrong?
• Django calling REST API from models or views?
• Django HTML Form Send Attachment Emails
• Post to django rest framework

Complete code repository: https://github.com/marcogdepinto/Django-Emotion-Classification-Ravdess-API .

EDIT: I changed the if statement inside IndexView.post as follows

        if form.is_valid():
            instance = form.save(commit=False)
            instance.save()

Now the request is OK but the file passed is empty

HTTP 201 Created
Allow: POST, DELETE, OPTIONS
Content-Type: application/json
Vary: Accept

{
    "file": null,
    "timestamp": "2019-08-16T06:15:58.882905Z"
}