Question

I feel really silly for having to ask this head desk but I’ve got no idea why this code isn’t working it really simple sigh

I’m getting the following JavaScript error when I select from either of the drop downs and the form doesn’t submit.

Uncaught TypeError: Property ‘submit’ of object # is not a function

<form action="categories/view/52" method="post" accept-charset="utf-8" id="myform" name="myform"> 
<select name="sort" ID="sort_type" onchange='document.forms["myform"].submit();'>   
  <option value="label">Sort</option> 
  <option value="price-low-high">Price: Low - High</option> 
  <option value="price-high-low" selected="selected">Price: High - Low</option> 
  <option value="name-a-z">Name A - Z</option> 
  <option value="name-z-a">Name Z - A</option> 
  <option value="date-added-new">Date Added - New</option>  
  <option value="date-added-old">Date Added - Old</option> 
</select> 
<select name="limit" ID="sort_type" onchange='document.forms["myform"].submit();'>   
  <option value="items_3" selected="selected">3</option> 
  <option value="items_50">50</option> 
  <option value="items_100">100</option> 
  <option value="items_all">all</option> 
</select> 
<input type="submit" name="submit" value="submit"  />
</form> 

Answer 1

Since you have:

<input type="submit" name="submit" value="submit"  />

The submit function has been clobbered with that HTMLElementNode.

The simple solution is to rename it, or remove the name.

<input type="submit" value="submit"  />

If you can’t rename it (because you have server side code that depends on that value being submitted and you can’t change the server side code) then you can:

document.createElement('form').submit.call(document.forms["myform"]);