How to get image from django form ImageField input

Viewed 9772

I'm trying to get an image from a input ImageFile to display in the template and also save that ImageFile to the models ImageField.

The code below spits out an error:

upload_img_temp.write(uploaded_image)
TypeError: a bytes-like object is required, not 'str'

Form

class UploadImageForm(forms.ModelForm):
    class Meta:
        model = Image
        fields = ['image']

View

def uploadImageView(request):
    form = UploadImageForm(request.POST or None, request.FILES or None)
    if request.method == 'POST':
        if form.is_valid:
            request.session['image'] = request.POST['image']
            return redirect('image:create')

def imageCreateView(request):
    uploaded_image = request.session.get('image')
    upload_img_temp = NamedTemporaryFile()
    upload_img_temp.write(uploaded_image)
    upload_img_temp.flush()

    form_create = ImageModelCreateForm(request.POST or None, request.FILES or None,)

    if form_create.is_valid():
        instance = form_create.save(commit=False)
        instance.image = upload_img_temp

Template

<img class="image" src="{{ upload_img_temp }}">

  <form method="POST" action="">
    {% csrf_token %}
    <input type="submit"></input>
    {{ form }}
  </form>

Model

def upload_location(instance, filename):
    filebase, extension = filename.split(".")
    return "%s/%s.%s" %('picx', uuid.uuid4(), extension)

class Image(models.Model):
    image           = models.ImageField(
                        upload_to=upload_location,
                        null=False,
                        blank=False,
                        )
4 Answers

There may be many possibilties for the error. Firstly you need to make sure you specify upload_to attributes in quotes like upload_to='images'

class ProductImage(models.Model):
    image = models.ImageField(
               upload_to='images',
               null=False,
               blank=False,
              )

which will create a folder named images under the media folder and place image within this images folder. Second you need to make sure that you add enctype='multipart/form-data' inside tag as

<img class="image" src="{{ upload_img_temp }}">

  <form method="POST" action="">
    {% csrf_token %}
    <input type="submit"></input>
    {{ form }}
  </form>

Third instead of saving image to session you can simply save that image to your model class as model instance by saying

def uploadImageView(request):

    def uploadImageView(request):
        form = UploadImageForm(request.POST or None, request.FILES or None)
        if request.method == 'POST':
            if form.is_valid:
                form.save()
                context['form']=form
                return render(request, 'your_file_name.html', 
                {'context':context}
                )

and accessing that image instance in your template by setting img url as

<img url="{{form.image.url}}">

form: object = active_form(request.POST or None, request.FILES or None, instance=post)

Related