My previous blog entry has a link to another site. It is not just a link but is actually a form that is submitted to the other site. This caused an interesting problem during implementation.
These blog entries have HTML enabled so I can do some formatting and also so that I can include a link to my own personal CSS file. I need to do this because I opted to use the generic blog feature of the 1&1 web server and I can’t change the CSS or JavaScript for the blog directly. Each entry gets a link tag added to it to link to my own CSS file on my own website.
The problem with the embedded form and the JavaScript to go with it is that the script tag is enclosed in paragraph tags and doesn’t work. It looks okay but the browser doesn’t seem to accept it as script in that situation.
The solution was to place all of the JavaScript code inside of the onlick attribute for the hyperlink that submits the form. I don’t use a button in the form because I didn’t want a button. Where this got tricky was how the function is specified. I used the new function() {} syntax and placed all of the code in that function. It must be all on a single line up to the end of the closing of the hyperlink tag or the blog software would add line break tags inside of the JavaScript.
The form in the blog post looks like this:
<form method="post" target="-blank">
<div style="text-align: center;">
<a href="#" onclick='new function() { var form1 = document.forms[0]; today = new Date(); var themonth = today.getMonth() + 1; var theyear = today.getYear(); if (theyear < 1000) { theyear += 1900; } var theday = today.getDate() - 1; var datestring = themonth+ "/" + theday+ "/" + theyear; var theaction = "http://laketahoe.jpl.nasa.gov/field-data/resultsdisplay2?debug=off&tb1=1&tb2=1&tb3=1&tb4=1&enterdate=startdate&sampleintrvl=30&engunits=english&grphwidth=500&grphheight=500&starthr=00:00&endhr=23:59&avgtemp=1&minytempplt=&maxytempplt=&minytempradplot=&maxytempradplot=&sensorselection=0&minywind=&maxywind=&minywinddir=&maxywinddir=&windrange=&minyairtemp=&maxyairtemp=&minyrelhum=&maxyrelhum=&minyatphpress=&maxyatphpress=&minyskinplot=&maxyskinplot=&minypwr=&maxypwr=&1&tb1sen1=1&tb1sen2=1&tb1sen3=1&tb1sen4=1&tb1sen5=1&tb1sen6=1&tb1sen7=1&tb1sen8=1&tb2sen1=1&tb2sen2=1&tb2sen3=1&tb2sen4=1&tb2sen5=1&tb2sen6=1&tb2sen7=1&tb2sen8=1&tb3sen1=1&tb3sen2=1&tb3sen3=1&tb3sen4=1&tb3sen5=1&tb3sen6=1&tb3sen7=1&tb3sen8=1&tb4sen1=1&tb4sen2=1&tb4sen3=1&tb4sen4=1&tb4sen5=1&tb4sen6=1&tb4sen7=1&tb4sen8=1&"; theaction += "startdate=" + datestring + "&" + "enddate=" + datestring + "&"; form1.action = theaction; form1.submit(); return false; };'><b>Click Here</b></a>
</div>
</form>
You can also go to that post and view the page source if you want to see it in some sort of editor.