Image input missing from POST request

[Abhishek Batra]

Hi,

This is probably not a Django issue, but just trying my luck.

I have an input field corresponding to a Django ImageField in a Django template. Rendered, the HTML looks like:

<form action="/accounts/username/" 
      method="post" 
      id="profile_form"
      enctype="multipart/form-data">
</form>
... (other input fields and elements)
<input form="profile_form" id="id_profile_pic" name="profile_pic" type="file" />

The corresponding View is an UpdateView. I found request.FILES to be empty and request.cleaned_data to contain 'profile_pic': None.

I used firebug to track the POST data. It contained other fields but not profile_pic.

Can anyone say why the file does not get uploaded? I've posted this question to StakOverflow as well, in case someone wants reputation points.

Thanks,
Abhishek Batra

[donarb]

The input field is outside the closing </form> tag so would not be uploaded as part of the form. 

[Abhishek Batra]

Hey Donarb,

Input fields are not required to be inside form elements, so long as they specify the form attribute as I have done. Check the form attribute here for reference.

Moreover, I have other input fields as well which are outside the form element, but they get successfully submitted.

Any other suggestions anyone?

Thanks,

Abhishek

[Collin Anderson]

Hi,

I certainly am learning something new about <input form="id_of_form">. However, it may be that that trick simply doesn't work correctly for file fields. My question is: _does_ it work correctly when the <input> is a child of the <form>?

Collin

[Abhishek Batra]

Hi Collin,

Thanks for taking time out to look at this. It turns out that I somehow I copied the rendered HTML wrong! The real problem was that the form id used in input was incorrect and this was the reason for the file not getting uploaded.

Separately, this is not really a trick but a fairly standard technique nowadays, and after correcting my mistake, it works just fine.

Thanks,

Abhishek

[Fred Stluka]

Abhishek,

Good tip about the <input form="..."> syntax!  I didn't realize
you could do that to avoid having to nest the <input> fields
inside the <form>.

I just looked it up at:
- http://www.w3schools.com/tags/att_input_form.asp
where it says 2 interesting things:
- Not supported in IE
- Can specify multiple forms that the same input field is
   a part of, so presumably, the field would be POSTed with
   any of the listed forms.  Rest of the page does not make
   it obvious how to do that though.  Value is a string of
   space-separated form ids perhaps?

Any comment of either of these 2?  Have you tried your app
on IE?  Have you tried specifying multiple forms?

Thanks!

--Fred

---

Fred Stluka -- mailto:fr...@bristle.com -- http://bristle.com/~fred/
Bristle Software, Inc -- http://bristle.com -- Glad to be of service!
Open Source: Without walls and fences, we need no Windows or Gates.

---

--
You received this message because you are subscribed to the Google Groups "Django users" group.
To unsubscribe from this group and stop receiving emails from it, send an email to django-users...@googlegroups.com.
To post to this group, send email to django...@googlegroups.com.
Visit this group at http://groups.google.com/group/django-users.
To view this discussion on the web visit https://groups.google.com/d/msgid/django-users/aea0cc13-0b33-4734-b59f-a4f06ae12c14%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

[Abhishek Batra]

Hey Fred,

I won't rely on w3schools for much. I recommend you check out the description of the form attribute through Mozilla's documentation. It clearly says

An input can only be associated with one form.

I haven't ever tried it though. I have also not tried out the form attribute on IE. Maybe I'll do it the next time I reboot into Windows ;-)

Thanks,

Abhishek 

On Thursday, November 27, 2014 12:45:39 AM UTC+5:30, Fred Stluka wrote:

Abhishek,

Good tip about the <input form="..."> syntax!  I didn't realize
you could do that to avoid having to nest the <input> fields
inside the <form>.

I just looked it up at:
- http://www.w3schools.com/tags/att_input_form.asp
where it says 2 interesting things:
- Not supported in IE
- Can specify multiple forms that the same input field is
   a part of, so presumably, the field would be POSTed with
   any of the listed forms.  Rest of the page does not make
   it obvious how to do that though.  Value is a string of
   space-separated form ids perhaps?

Any comment of either of these 2?  Have you tried your app
on IE?  Have you tried specifying multiple forms?

Thanks!

--Fred

---

Fred Stluka -- mailt...@bristle.com -- http://bristle.com/~fred/