this.form.submit() not working after clicking div element in form

Question

I was trying to test form submission using mouse clicks but the form doesn't seem to submit with vanilla javascript.

I'm using this simple markup and code:

<form name="form" id="price" action="" method="post">
<div class="category" name="price" value="50 dollars" 
onClick="this.form.submit();"
>price</div>

</form>

<?php
echo $_POST['price'];

?>

I can submit the form with Jquery, but I don't understand why this.form.submit() is not working with vanilla javascript? I'm using Chrome to test this.

Answer 1

A div is not a form element. There is no this.form for it.

You can still do document.forms.form.submit() (.form since you have name="form")