CODEWITHSUNDEEP
javascriptjqueryhtml
Rajnikanth
Rajnikanth

Reputation: 2785

form is not submiting with onclick event

I am trying to submit form on image click event but I am getting Uncaught TypeError: Object #<HTMLInputElement> has no method 'submit' this error after click event fire.

My Code:

<form name="searchRef" id="searchRef" method="get" action="#">
  <input type="text" name="s" id="ref" value="" class="ref_search" />
  <input type="submit" name="submit" id="ref_submit" value="GO" class="ref_submit" />
  </span> <span> <img src="http://www.webdeveloper.com/forum/image.php?s=2c556ca62e6fd2a2e4d6ca925fb3fda1&u=8331&dateline=1057444055" alt="Go" onClick="document.getElementById('searchRef').submit();"> </span>
</form>

Any ideas or suggestions? Thanks.

Upvotes: 0

Views: 127

Answers (6)

Suraj Singh
Suraj Singh

Reputation: 4059

This error occurs because your name attribute as submit, try to change the name attribute or try below code.

  <img src="http://www.webdeveloper.com/forum/image.php?s=2c556ca62e6fd2a2e4d6ca925fb3fda1&u=8331&dateline=1057444055" alt="Go" onclick='window.searchRef.submit();' />

Upvotes: 0

Asenar
Asenar

Reputation: 7010

There is probably already an html element with id=searchRef in your page, so the getElementById() get the wrong one.

A better solution would be to replace your submit button by an input type=image:

<input type="image" name="ref_submit" id="ref_submit" value="GO" class="ref_submit" 
  src="path/to/your/image"  />

Notice this will result in server side by a POST request with $_POST['submit_x'] and $_POST['submit_y'] (which corresponds to the (x,y) mouse coordinates from the top left of the image)

Upvotes: 0

Rejayi CS
Rejayi CS

Reputation: 1061

please change the form tag action attribute , repalce # with the target page name say action.php, and also add onsubmit="javascript:return false" in form tag

Upvotes: 0

feddus
feddus

Reputation: 356

this is just an idea, but try using

document.forms["searchRef"].submit();

instead of

document.getElementById('searchRef').submit();

Upvotes: 0

Dhaval
Dhaval

Reputation: 2861

Change your submit button name from submit to ref_submit

as shown below

<input type="submit" name="ref_submit" id="ref_submit" value="GO" class="ref_submit" />

Upvotes: 2

A. Wolff
A. Wolff

Reputation: 74420

You have to remove/change attribute name of submit button, e.g:

name="btnSubmit"

Otherwise, submit() method of FORM element is overwritten.

Upvotes: 2

Related Questions