Submit a form

[lukeurtnowski]

I have a simple upload form within another form.
http://www.teamluke.net/citylights/my-profile.php
I can’t figure out why the form isnt being submitted (going to upload_avatar.php when an image is selected. I thought this script would submit the form when an image is selected

<script>
document.getElementById("input-upload").onchange = function() {
    document.getElementById("upload-avatar").submit();
}
</script>

[fretburner]

Hey Luke, have you checked the browser’s console for errors?

[lukeurtnowski]

yes, when I select an image, I get.,.

the error:
Uncaught TypeError: Cannot read property ‘submit’ of null
at HTMLInputElement.document.getElementById.onchange (my-profile.php:456)

Is kind of confusing to me as the forms id is upload form

<form action="upload_avatar.php" method="post" enctype="multipart/form-data" id="upload-form">
...
</form>

[fretburner]

If you view the source of the page you can see the form element that you mention above but, if you inspect the page (using Chrome’s devtools, for example) the nested form tag is no longer there.

If you run the page through a validator it turns out that nested forms are not valid HTML, so it seems that the browser is probably stripping them out.

Probably the simplest solution is to move the avatar upload form outside of the main form.