How to crop images in Django and Javascript | Django and ajax

Поділитися
Вставка
  • Опубліковано 14 жов 2024

КОМЕНТАРІ • 52

  • @Pyplane
    @Pyplane  4 роки тому +8

    Hi! Under this link you can find the source code including base.html with cdns for the cropper js library: blog.pyplane.com/blog/how-to-crop-images-in-django-with-javascript/ Cheers!

  • @mohammedrayyan7308
    @mohammedrayyan7308 2 роки тому +1

    Thanks man , You saved my day without this tutorial I couldn't have completed my project.
    Appreciate your work

  • @danielnolan320
    @danielnolan320 4 роки тому +2

    Simply amazing! This taught me exactly what I needed. I cannot thank you enough for your videos. Facebook group is a great idea too. I'll see you there!

    • @Pyplane
      @Pyplane  4 роки тому +1

      Thanks Daniel. I should actually also thank you, because this project perfectly fits to this django & js series! Cheers!

  • @ericryan8152
    @ericryan8152 3 роки тому

    Thank you so much for this tutorial! I just completed a student project where I had to allow Django users crop a photo. It was tough to figure out and I didn’t quite get it to work like I wanted it to, good enough to pass the project, but not like I wanted. I’ll definitely be keeping this video to reference for the next time I implement this feature!

  • @denisbuldakov6284
    @denisbuldakov6284 4 роки тому +2

    Sir, your tutorials are absolutely great! It would be great if you could extend this video to show an example with existing image. Something like: click on the image -> redirect to the crop page (or bs modal) -> crop the image ->save/replace the existing image. I would do it myself but I'm crap at js...

  • @paborlouise319
    @paborlouise319 4 роки тому

    Django and vanilla Js is getting crazier than I thought. Luke you're the man. Sweet 👍🏻.

    • @Pyplane
      @Pyplane  4 роки тому

      Thank you Pabor! All the best to you!

    • @paborlouise319
      @paborlouise319 4 роки тому

      @@Pyplane pls can you do a video on default image size in django. i.e setting the img size in the backend.

    • @Pyplane
      @Pyplane  4 роки тому

      @@paborlouise319 I don't know right now if I haven't created something like that in Django with opencv or in Django with ai. Will look later into those videos and if this what you are asking for is not there I'll think about putting it into future tutorials

    • @paborlouise319
      @paborlouise319 4 роки тому

      @@Pyplane okay good 👍🏻. Thanks.

  • @invilso4051
    @invilso4051 2 роки тому

    It's a best video. Very helpfules. The video help me in my problem.

  • @dhruvilshah9098
    @dhruvilshah9098 4 роки тому +1

    Awesome sir, adding many of your Js things in my projects.

    • @Pyplane
      @Pyplane  4 роки тому +2

      Cool! Very happy to read this :) Cheers!

  • @Andreas-iy7hn
    @Andreas-iy7hn 3 роки тому +1

    Finally got what I have been searching, nice work :)
    subscriber += 1

    • @Pyplane
      @Pyplane  3 роки тому

      Thank you Andreas! :)

    • @Andreas-iy7hn
      @Andreas-iy7hn 3 роки тому

      @@Pyplane hi pyplane, I'm creating a form with title and cropped picture; however, I'm getting error that crop_image_title doesn't exist in the table. Moreover, I tried another method but the title doesn't appear in the table. I'm thinking about the Ajax request and post thing since I have no idea about AJAX :(. Any suggestion or solution would help :)

    • @Andreas-iy7hn
      @Andreas-iy7hn 3 роки тому

      I also did makemigrations and migrate, and of course added title in the form

  • @mateoclemente7824
    @mateoclemente7824 2 роки тому

    Great tuto! Could we get a github to try it ourselves?

  • @mohammadshafayethaydar1652
    @mohammadshafayethaydar1652 4 роки тому

    You're just awesome. Thankful to you.

    • @Pyplane
      @Pyplane  4 роки тому

      Hi Mohammad! Very happy you enjoy my videos :) Cheers!

  • @jithinrajmmwayanad4267
    @jithinrajmmwayanad4267 2 роки тому

    i have a suggetion for you ... please explain the method which your using in javascript , mens in this video you were used createobject url but you didint metion what it does.....
    its better to understand pls pls pls

  • @rangabharath4253
    @rangabharath4253 4 роки тому

    Awesome as always 👍😀

    • @Pyplane
      @Pyplane  4 роки тому

      Thank you Ranga :))

  • @arifmoazy1371
    @arifmoazy1371 3 роки тому

    keep up the great work

  • @thing2know
    @thing2know 2 роки тому

    its awesome tutorial in my project the total code is working fine but the picture will not cropped certain size after selecting the image particular size the image is successfully submitted but full image will be submitted .may i know where is the error.? thank you..

  • @fadhilahrizkifatoni4380
    @fadhilahrizkifatoni4380 2 роки тому +1

    How to send the cropped image to backend without ajax ?

  • @mahmudsajib8648
    @mahmudsajib8648 4 роки тому

    Awesome thanks man!

    • @Pyplane
      @Pyplane  4 роки тому

      Thanks for watching Mahmud!

  • @irajdeepmondal
    @irajdeepmondal 4 роки тому +1

    Amazing video sir, as always. But I can't join the Facebook group, it says "This Content Isn't Available Right Now
    When this happens, it's usually because the owner only shared it with a small group of people, changed who can see it or it's been deleted.".

    • @Pyplane
      @Pyplane  4 роки тому

      Hi Rajdeep. Thanks for the feedback. That's really strange because I didn't provide any weird settings. Can you try again later? Once again sorry for the trouble

  • @aayushpatil7514
    @aayushpatil7514 4 роки тому

    Please make a video on integrating Django with editor js ❤️❤️❤️

  • @szymonpopielarz7701
    @szymonpopielarz7701 3 роки тому

    Could you do tutorial with cropping profile picture for django user? How do it when on website are 2 forms (one for account and one for image connected OneToOneField to django user account)?

  • @rezasadeghi2520
    @rezasadeghi2520 4 роки тому

    Awesome! thanks

    • @Pyplane
      @Pyplane  4 роки тому

      Thanks for watching!

  • @OxMiroslav
    @OxMiroslav 3 роки тому +3

    I was trying to crop and upload an image based on this tutorial. However, It didn't go smoothly as for author since I had have different name for table file column. I spend a lot of time debugging missing "file" and no save to form in Django. The most critical row is "fd.append('file', blob, 'my-image.png');" The first parameter 'file' is related to database column in your database. Author called it 'file', if you'll have different name (for example avatar) change it "fd.append('avatar', blob, 'my-image.png');" .
    Hope it helps somebody.

    • @frost1204
      @frost1204 2 роки тому

      I spent abt an hour or more trying to figure this out xD if only i have read this earlier. Tho trying to debug everything gave me a better understanding of the code

    • @ayushrathore8296
      @ayushrathore8296 2 роки тому

      Thanks bro, you saved me a lot of time

    • @thing2know
      @thing2know 2 роки тому

      Hi, I am not getting output after changing the file name but I am getting total image as output but I am not getting cropped image output,may i know the reason please. Thank you

  • @josevelez6865
    @josevelez6865 3 роки тому

    Thanks for sharing this! Very helpful.
    One question, I am trying to get mine to redirect to a different page after success. I cannot figure it out. Any tips?

    • @김태연-z8y
      @김태연-z8y 2 роки тому

      I'm facing the same problem. Did you find a solution?

  • @thing2know
    @thing2know 2 роки тому

    Hi is there any tutorial to crop the video file in django.

  • @derekkroeker4582
    @derekkroeker4582 2 роки тому

    How to only be able to scale with Width and height at the same time, so it stays in the same shape, but just being able to scale and choose area.

  • @QTSkipper
    @QTSkipper 3 роки тому

    If anyone facing the issue of empty space forming at the side of the image,
    then just replace, width="500px" at line 16 of main.js by width=100%

  • @AbdullahAbdullah-lh5mw
    @AbdullahAbdullah-lh5mw Рік тому

    Why the size of the image increase after cropping ??

  • @jameskulu
    @jameskulu 4 роки тому

    can you make tutorial for adding filter in pictures like in instagram ?

    • @Pyplane
      @Pyplane  4 роки тому

      Hi James. I think I did something like that already. Have you seen the django with opencv video? Cheers!

  • @yukselbastan4687
    @yukselbastan4687 4 роки тому

    We had a big Earthquake here in izmir Turkiye, it's possible that i can't write for some days because of bad internet connection. If its possible we want a video for rotating images. Thanks.

    • @Pyplane
      @Pyplane  4 роки тому

      Hi Yuksel. Sorry to read this. Stay safe!

  • @UmaDevi-dv4wt
    @UmaDevi-dv4wt 3 роки тому

    hey plss can you help me I got an error that image cropper is not defined but my code is correct

  • @jithinrajmmwayanad4267
    @jithinrajmmwayanad4267 2 роки тому

    success is not working properly
    can you help me