Where to put custom JavaScript/Prototype code for an ActiveScaffold form?

I have a Select dropdown on the form of an ActiveScaffold. I am trying to hide some of the fields on the form if a particular value is selected.

A [similar question][1] was posted to the ActiveScaffold Google Group, and the supplied Prototype code looks to do what I need, however I don't know where I need to add this.

--

I tried taking a copy of -horizontal-subform-header.html.erb from Vendor/plugins/ active_scaffold/frontends/default/views, placing it in views folder of my controller, and then adding my script into it:

<script type="text/javascript">
  document.observe('dom:loaded', function() {  //do it once everything's loaded
    //grab all the product-input classes and call 'observe' on them :
    $$('.product-input').invoke('observe', 'change', function(e) {
      this.up('td').next('td').down('input').hide();
    });
  });
</script>

... but that doesn't seem to work properly. It works if I use a URL to go direct to the form (i.e. http://localhost:3000/sales/20/edit?_method=get). But when I test it with the main list view (i.e. http://localhost:3000/sales/) a开发者_运维问答nd opening the form via Ajax, then it doesn't work. Looking at the HTML source the just does not appear.

The common place for adding JavaScript is application.js found in public/javascripts. I'm a jQuery guy myself, however I'm sure you can hook up to the onchange event in application.js with prototype. A quick search looks like Event.observe should do the trick.