联合国部分渲染?

A user can assign a referral to an event from two separate lists, an old collection and new collection. Both collections are assigned to the same attribute. Because of this, whichever collection_select is rendered last is the only one that the form recognizes. Because of this, I've decided to render the second list only if the user needs it like so:

<div id="old_collection">
  <%= collection_select(stuff) %>
</div>

<div id="new_collection"></div>

<input id="render_new_collection" href="#" type="checkbox">New-Collection?      

<script>
    $j(function(){
      $j("#render_new_collection").click(function(){
        $j("#old_collection").toggle();
        $j("#new_collection").html("<%= escape_javascript(render(:partial => 'new_collection')) %>");
      });
    });
</script>

This works fine, but the way it's set up up is a dead end: the user can't change their mind and use the old collection unless they refresh the page. Is there a way to un-render the partial, leaving only the original form on the page?

You can do it by toggling between the new collection and the old collection.

$j(function(){
  $j("#render_new_collection").change(function(){
    if($j(this).is(':checked')) {
      $j("#old_collection").hide();
      $j("#new_collection").html("<%= escape_javascript(render(:partial => 'new_collection')) %>");
    }
    else {
      $j("#old_collection").show();
      $j("#new_collection").html('');
    }
  });
});

Though this should work but we should keep the javascript code in separate javascript files.