Okay, so basically I created a function in django where you can change the profile picture but the issue is that It’s doing something else instead. Have a look below to understand what’s happening

I have added these codes into my settings.py file

settings.py

STATIC_URL = 'static/'

MEDIA_URL = '/media/'

MEDIA_ROOT = os.path.join(BASE_DIR, 'media/')

and also added these to the urls.py

urls.py

from django.contrib import admin
from django.urls import path , include 
from django.conf.urls.static import static
from django.conf import settings 

urlpatterns = [
    path('admin/', admin.site.urls),
    path('user/',include('members.urls')),
    path('',include('blogposts.urls')), # MAIN URL 
    
]

if settings.DEBUG:
    urlpatterns += static(settings.MEDIA_URL,document_root = settings.MEDIA_ROOT)

This is the model that I created for the User

models.py

class Profile(models.Model):
    user = models.OneToOneField(User,on_delete = models.CASCADE, null = True , blank = True )
    bio = models.TextField()
    profile_pic = models.ImageField(upload_to = 'images',default= '/../media/images/image.png')

    def __str__(self):
        return str(self.user)

This is the form that I created to change the Profile Pic

forms.py

class ProfileForm(forms.ModelForm):
    class Meta:
        model = Profile 
        fields = ['profile_pic']

This is the urls.py inside the app

urls.py (app)

from django.urls import path , include 
from . import views 


urlpatterns = [
    path('',views.homepage,name = 'home-page'),
    path('view_post/<int:pk>',views.view_post,name='view-post'),
    path('blogcreation',views.create_blog,name='blog-form'),

    path('aboutme',views.about_user,name = 'show-user'), # this is the one that takes to the page where you can change your profile picture and displays your bio

    path('delete/<int:pk>',views.delete_post,name = 'delete-post'),
    path('edit_blog/<int:pk>',views.edit_blog,name = 'edit-post'),
]

These are the codes in views.py

views.py

def about_user(request):

    profile = Profile.objects.all()

    if request.method == "POST":
        form = ProfileForm(request.POST,request.FILES)
        if form.is_valid():
            form.save()
            return render(request, 'show_user.html',{'form':form,'profile':profile})

    else:
        form = ProfileForm()
    return render(request, 'show_user.html',{'form':form,'profile':profile})

and finally. This is show_user.html my html page.

show_user.html

{{user.profile.bio}}
<img src = "{{user.profile.profile_pic}}" height = "500">



<form method="POST" enctype="multipart/form-data">
    {% csrf_token %}
    {{ form.as_p }}
    <button type="submit">Upload</button>
</form>

and these are my directories.

Now the issue is that my user profile bio is working fine and my default user profile is showing.

But when I want to change the pic and click on ‘choose file’ and choose a random pic which is located in my media folder

after selecting ‘download.jpg’ and uploading it. This is what happens.

any solutions ?

I cannot wrap my head around this and I can’t find any solutions.