django uploaded images from admin panel not displayed in the homepage

Using Django Forms & APIs
1

i created a django project to upload images both from the user interface and from the admin panel. but when uploading images from user interface, the images are not uploaded to the media folder.and also not shown in the homepage. but when uploading from the admin panel, the images are uploaded to the media folder correctly but in the home page the images are not shown. this problem is with the images only. other fields are correctly displayed like the title, price aand so on. tell me how to fix my issue. these are my code snippets. user interface uploading code

      <div class="layout__body">
        <form
          class="form"
          action=""
          method="POST"
          enctype="multipart/form-data"
        >
          {% csrf_token %}

          <div class="form__group">
            <label for="post_category">Enter a Category</label>
            <input
              required
              type="text"
              value="{{post.category.name}}"
              name="category"
              list="category-list"
            />
            <datalist id="category-list">
              <select id="post_category">
                {% for category in categories %}
                <option value="{{category.name}}">{{category.name}}</option>
                {% endfor %}
              </select>
            </datalist>
          </div>

          <div class="form__group">
            <label for="post_name">Post Title</label>
            {{form.title}}
          </div>

          <div class="form__group">
            <label for="post_image">Post Image</label>
            {{form.image}}
          </div>

          <div class="form__group">
            <label for="post_price">Post Price</label>
            {{form.price}}
          </div>

          <div class="form__action">
            <a class="btn btn--dark" href="{{request.META.HTTP_REFERER}}"
              >Cancel</a
            >
            <button class="btn btn--main" type="submit">Submit</button>
          </div>
        </form>

views.py for post creation

@staff_member_required
@login_required(login_url='login')
def create_post(request):
    form = PostForm(request.POST,request.FILES)
    categories = Category.objects.all()
    if request.method == 'POST':
        category_name = request.POST.get('category')
        category,created_at = Category.objects.get_or_create(name = category_name)
        
        Post.objects.create(
            host=request.user,
            category=category,
            title=request.POST.get('title'),
            image=request.FILES.get('post_image'),
            price = request.POST.get('price')
        )
        print(request.FILES)
        return redirect('home')

    context = {'form': form, 'categories': categories}
    return render(request, 'base/post_form.html', context)

and models.py

def post_image_path(instance, filename):
    # Customize the upload path for posts based on the posting admin's username and category
    if instance.host and instance.category:
        # Create a folder based on the posting admin's username
        username_folder = instance.host.username
        # Create a subfolder based on the category name
        category_folder = instance.category.name.replace(' ', '_').lower()
    else:
        username_folder = 'unknown_user'
        category_folder = 'uncategorized'

    # Construct the full upload path
    upload_path = os.path.join('uploads', 'posts', username_folder, category_folder, filename)
    print("Upload path: ",upload_path)
    return upload_path


class Post(models.Model):
    host = models.ForeignKey(User,on_delete=models.SET_NULL, null=True)
    category = models.ForeignKey(Category, on_delete=models.SET_NULL,null=True)
    participants = models.ManyToManyField(User, related_name='participants',blank=True)
    title = models.CharField(max_length=200)
    image = models.ImageField(upload_to=post_image_path)  # Adjust upload path as needed
    price = models.DecimalField(max_digits=10, decimal_places=2)
    # content = models.TextField()  # Add content field for post body
    updated_at = models.DateTimeField(auto_now=True)
    created_at = models.DateTimeField(auto_now_add=True)  # Auto-populate creation date

    total_likes = models.IntegerField(default=0)
    
    class Meta:
        ordering = ['-updated_at','-created_at']

    def __str__(self):
        return self.title

and the home page to display the images

        <div>
          <a href="{% url 'post' post.pk %}">
            <img
              src="{{ post.post_image.url }}"
              alt="{{ post.title }}"
              class="responsive-img"
            />
          </a>
        </div>

        <div class="Post">
          <a
            href="{% url 'user-profile' post.host.id %}"
            class="roomListRoom__author"
          >
            <div class="avatar avatar--small">
              <img src="{{post.host.avatar.url}}" />
            </div>
            <span>@{{post.host.username}}</span>
          </a>
        </div>

        <div>
          <span class="price"><br />ETB {{ post.price }}</span>
        </div>

so please fix this issue

i want to correctly upload the images from the user interface and i want to display the images in the home page

2

Please post your PostForm.