We had a form which we were loading dynamically on a key press and the form had buttons of the form:
<a href="#" onclick="if ($('myform').onsubmit()){$('myform').submit();};"><span>go</span></a>
None of the buttons were functioning correctly, and were not producing error messages.
To make things even more interesting, the form was being created from a partial in a helper (Rails).
The code basically looked like this:
toggle = link_to_function "---HTML---", do |page|
page << "--some javascript--"
page.insert_html :top, 'main', :partial => 'friendships/new', :locals => {:friend => friend}
page << "--some javascript--"
end
The form was contained in the 'friendships/new' partial.
Needless to say, the raw html produced was very ugly and full of various amounts of escapes and quotes. I was pretty sure that this was the source of the problem. I was wrong.
It was pointed out by karma that the problem was really a permissions issue. The page.insert bit in the helper uses prototype.js to create the html and insert it into the page at the top of the div with id='main'. The problem is that the order it does this in is:
1. Instantiate the html.
2. Insert into postion.
As karma points out, that leaves all javascript operating at the security level of about:blank.
The solution was to add a funny little bit of javascript to the page:
page << "var x = $('myformcontainer').innerHTML;$('myformcontainer').innerHTML = x;"
This had the effect of re-inserting the code in place on the page, rather than instantiating it first.
