Computer Science Canada

Submitting a form using javascript

Author:  apomb [ Tue Mar 08, 2011 1:50 pm ]
Post subject:  Submitting a form using javascript

Hey guys, Its been a while since ive been around, since I haven't been on the web-dev front until just recently, so this question will sound very noobish.

There is an issue with the search function on my website, I have gotten the search to work correctly when using the enter key to submit the form, however, when the "search" button (which is simply an image) is clicked, it simply goes to google without the form actually being submitted.

code:
<script type="text/javascript">
 
var domainroot="www.herpderp.com";
 
function Gsitesearch(curobj){
 
    curobj.q.value="site:"+domainroot+" "+curobj.qfront.value

}
 
function submitSearchForm() {
  var myForm = document.getElementById("searchForm");
 
  myForm.submit();
 
}
</script>
<form action="http://www.google.com/search" method="get" onSubmit="Gsitesearch(this)">
<div class="search-container"><input name="q" type="hidden" />
<input name="qfront"  class="searchbox" type="text" style="width: 128px" />
<a href="javascript&#058; submitSearchForm()"> <img alt="" class="style1" src="Site/graphics/elements/search.png" /></a>
</div></form>
</div></div>


Could someone shed some light on how this doesnt work?

I have an idea that is has to do the submitSearchForm()

Author:  DemonWasp [ Tue Mar 08, 2011 2:16 pm ]
Post subject:  RE:Submitting a form using javascript

You're right -- you haven't bothered giving your form an ID so trying to get that element by ID isn't going to work very well.

As a side note, consider just using the form discussed here: http://www.codetoad.com/html/buttons/image_submit_button.asp

Basically, you skip onclick / javascript-links in favour of an image that just submits the form the same way pressing enter would.

Author:  apomb [ Tue Mar 08, 2011 4:18 pm ]
Post subject:  Re: Submitting a form using javascript

Well, I'm specifically having trouble with the following section:

code:
<form id="searchForm" action="http://www.google.com/search" method="get" onsubmit="return Gsitesearch(this)">
<div class="search-container"><input name="q" type="hidden" />
<input name="qfront"  class="searchbox" type="text" style="width: 128px" />
<INPUT TYPE="image" SRC="Site/graphics/elements/search.png" ALT="Submit Form">
</div></form>


This code is untested, but I think it should work now.

EDIT: it does.

Thank You.


: