Here's my problem: I have a combo box that when its index changes I want a div tag with the id="services" to repopulate with checkboxes based on that comboboxes value. I want this to be done using ajax. This is my first time working with ajax for rails so I need a helping hand. Here is what I have so far:

My application.js file. Something that Ryan uses in one of his railscasts. This is supposed to be a helper method for handling ajax requests. Is this useful? Should I be using this?:

//<![CDATA[
$.ajaxSetup({
  'beforeSend': function(xhr) {xhr.setRequestHeader("Accept","text/javascript")}
});

// This function doesn't return any results. How might I change that? Or
// should I have another function to do that?
$.fn.submitWithAjax = function() {
  this.submit(function() {
    $.post($(this).attr("action"), $(this).serialize(), null, "script");
    return true;
  });
};
//]]>

An external javascript file for this template (/public/javascripts/combo_box.js):

//<![CDATA[
$(document).ready(function(){
  $('#event_service_time_allotment').change(function () {
    // maybe I should be using submitWithAjax(); ??
    $(this).parent().submit();
  });
});
//]]>

My ???.js.erb file. I'm not sure where this file should go. Should I make an ajax controller?? Someone help me out with that part please. I can write this code no problem, I just need to know where it should go and what the file name should be called (best practices etc):

// new.js.erb: dynamic choices... expecting a time_allotment
alert('test');
// TODO: Return a json object or something with a result set of services
// I should be expecting something like:
// params[:event_service][:time_allotment] i think which I should use
// to return a json object (??) to be parsed or rendered html
// for the div#services.

Here is my controller's new action. Am I supposed to respond to javascript here? Should I make an ajax controller instead? What's the best way to do this?:

# /app/controllers/event_services_controller.rb
def new    
  @event_service = EventService.new

  respond_to do |format|
    format.html # new.html.erb
    format.xml  { render :xml => @event_service }
    format.js # should I have a javascript handler here? i'm lost!
  end
end

My /app/views/event_service/new.html.erb. My ajax call I think should be a different action then the form:

<% content_for :head do %>
  <%= javascript_include_tag '/javascripts/combo_box.js' %>
<% end %>

<% form_for @event_service, :url => admin_events_path, :html => {:method => :post}  do |f| %>

<!-- TimeAllotment is a tabless model which is why this is done like so... -->
<!-- This select produces an id of: "event_service_time_allotment" and a name of: "event_service[time_allotment]" -->
<%= select("event_service", "time_allotment", TimeAllotment.all.collect {|ta| [ta.title, ta.value]}, {:prompt => true}) %>

Services:
<!-- this div right here needs to be repopulated when the above select changes. -->
<div id="services">
  <% for service_type in ServiceType.all %>
  <div>
    <%= check_box_tag "event_service[service_type_ids][]", service_type.id, false %>
    <%=h service_type.title %>
  </div>
  <% end %>
</div>

<% end %>

ok so right now ALL of the services are there to be chosen from. I want them to change based on what is selected in the combobox event_service_time_allotment.

Thanks, I know this is super complicated so any helpful answers will get an upvote.