Approaches for adding multiple image on a post Django

Question

I am working on a platform where I need to allow users to upload multiple images in one post.

I want to keep it as simple as possible, so that a person wouldn't have to refresh the page to upload each image, or create and save a post before adding images.
If a user could delete or reorder images it would be nice

Can you give me advice on how to do it properly?

I am using django , postgres and here's what I have done so far .

On my models.py -

class ImagePost(models.Model):
    user = models.ForeignKey("profiles.HNUsers", on_delete=models.DO_NOTHING)
    image = OptimizedImageField("Post Image", blank=True, null=True)
    timestamp = models.DateTimeField("Timestamp", blank=True, null=True, auto_now_add=True)
    text = models.TextField("Description text", blank=True)

    class Meta:
        verbose_name_plural = "Image Posts"

It can take one image just fine . what should I change to make it multi upload post

On my views.py this is what I have done so far -

@api_view(['POST'])
@permission_classes((permissions.AllowAny,))
def image_post(request):
    if request.method == 'POST':
        data = request.data
        print(data)
        serializer = ImagePostSerializer(data=data)
        if serializer.is_valid():
            serializer.save()
            print("image object saved")

            try:
                image_post_object = ImagePost.objects.filter(user__id=data['user']).order_by('-timestamp')[0]
                print(image_post_object)
                try:
                    post = Posts()

                    post.user = HNUsers.objects.get(id=data['user'])
                    post.image_url = image_post_object.image.url
                    post.type = 'I'
                    post.category = data['category']
                    post.created_on = image_post_object.timestamp
                    post.text = image_post_object.text
                    save_post = post.save()
                    post_id = post.pk

                    try:
                        user = HNUsers.objects.get(pk=data['user'])
                        if user.user_type == 'HN':
                            payload = {
                                "user_name": user.full_name,
                                "image_url": user.profile_img_url,
                                "post_id": post_id,
                                "notification_type": "hn"
                            }
                            print(payload)
                            broadcast_notification('all', payload, 1)
                    except HNUsers.DoesNotExist:
                        print("user_id_does_not_exist")

                    print("post object created")

                except Posts.DoesNotExist:
                    print("Failed - post creation failed")

                except HNUsers.DoesNotExist:
                    print("Failed - user object not found")

            except ImagePost.DoesNotExist:
                print("Failed - image object not found")

    return Response(serializer.data, status=status.HTTP_200_OK)

Any advice is really appreciated.

this might answer your question https://stackoverflow.com/questions/34006994/how-to-upload-multiple-images-to-a-blog-post-in-django — Natnael A., Dec 06 '20 at 09:47

score 0 · Answer 1 · answered Dec 07 '20 at 01:05

0

I am not sure if this can help, but why you dont use more than one table to store images in DB:

class Images(models.Model):
    user = models.ForeignKey("profiles.HNUsers", 
           on_delete=models.DO_NOTHING)
    image_post = models.ForeignKey(ImagePost, on_delete=models.CASCADE)
    image = OptimizedImageField("Post Image", blank=True, null=True)

Now you have conected multiples images to a post and a user. Hope this helps a bit...

answered Dec 07 '20 at 01:05

Agustin Gonzalez Ribas

308
3
13

Can you explain a bit more? Thank you – Mitesh Dec 07 '20 at 05:42
Yes!, actually your class ImagePost is only capable to store one image per post(your actual class, you dont need imageField any more). If you create another class like the class I sent to you before, you will be able to save multiples images per post. You will end with a class to handle each post. And another class to store all images, and this last class will end like: image : image.jpg user: some_user post:some post. So you can store multiples images related to any user and any post – Agustin Gonzalez Ribas Dec 07 '20 at 10:13

score 0 · Answer 2 · answered Dec 12 '20 at 22:36

0

Check this excellent django version of jQuery-File-Upload :

https://github.com/sigurdga/django-jquery-file-upload

Some features:

Drag and drop files
Select multiple files
Cancel upload
Delete uploaded file

answered Dec 12 '20 at 22:36

Eric Martin

501
4
10

score -1 · Answer 3 · answered Dec 12 '20 at 17:23

-1

You can avoid a lot of code repetition and add multiple images for a model by creating an intermediate model which will handle mapping between your image and the model. Create proper binding like one to one , you can look at this tutorial

answered Dec 12 '20 at 17:23

gutsyDev

1

Approaches for adding multiple image on a post Django

3 Answers3