*Words of Wisdom From The Elder

I can’t remember the exact day but a few weeks ago around the start of the new year I changed out the site’s search to use Google’s search engine for AdSense.  Not thinking when I pasted the code I broke the comments and my contact form on the site for all Internet Explorer users.  The sad thing is I didn’t notice this until the other day when I started getting emails their was a problem.  For everyone that tried submitting comments and it not work I apologize.

The problem was when I pasted the Google AdSense Search code into my template it had a complete form tag thus giving me two form tags nested within each other.  After the paste I wound up with something like this.

<form runat="server">
    <!-- GOOGLE SEARCH -->
    <form method="get" action="someurl>
    </form>
</form>

With Asp.Net only one form tag is allowed within the body of a page and this is a topic that comes up a lot within Asp.Net forums and discussions.  There are ways around it like the one discussed on this article.  It isn’t an end of the world limitation just something you have to know or think about as you design your pages.

The way Google AdSense search works is when someone uses the search box in the top right of the site they are redirected to a page on my site that I control the layout on (this I like).  In my case it is called SearchResults.aspx.  Within that page there is JavaScript that takes the parameters via the URL and passes them into Google’s search specific for my site.  Results are then returned within the page within my site.  The end result is seamless to the end user and this cuts down on database work for my server.  But since I had two form tags in my html things were broke. 

Disclaimer:  The following is a hack that worked for my situation and may not work for all scenarios, use it at your own discretion.

After I figured out the problem I removed the Google start and end form tags.  Then I created a JavaScript function that took in an action and a method that would be used to replace the current one on the single form tag.  Here’s the JavaScript I added into the site.

<script type="text/javascript">
//<![CDATA[
function changeActionAndMethodOnFormAndSubmit(newAction, newMethod)
{
    var theForm = document.forms['Form1'];
    if (!theForm) {
        theForm = document.Form1;
    }
    theForm.action = newAction;
    theForm.method = newMethod;
    theForm.submit();
}
//]]>
</script>

Then within the Google code I added the function using the onclick event like this:

<input onclick="changeActionOnFormAndSubmit('http://keithelder.net/SearchResults.aspx', 'get')" type="submit">

After I uploaded the changes I typed something into the search and got results back.  Yeah.  I then tested in Firefox and IE7 and my hack worked.

The only problem with this approach is there is a lot of other hidden form fields getting passed over in the URL.  Mostly view state and event argument stuff.  While not perfect this quick fix worked for my scenario which is good since I really didn’t want to mess with the main source code of the site.  The only reason I even posted this is in case someone needed a quick fix / work around as well.