Change Second Select List Based On First Select List Value In Rails

Updated with answer code at bottom For second select box, show select options for only those staff members associated to the selected team. Form:    Example case: A user select

Solution 1:

First you fire an ajax call to your controller. (Keep in mind that this url from the ajax call must exist in your routes).

$(document).ready(function() {
  $("#team").on('change', function(){
    $ajax({
      url: "populate_other_list",
      type: "GET",
      data: {team_id: $(this).val()},
      // Callbacks that will be explained
    })
  });

Next you make your action inside your controller.

defpopulate_other_list
  team_id = params[:team_id]
  @staff = Staff.find_by team_id: team_id
  respond_to do|format|
    format.json { render json:@staff }
  endend

With this, on your success callback of your ajax call, you get a JSON object with your list. So you need to clear the staff select and create the options and append to it.

// Ajax callsuccess: function(data) {
  $("#staff_member_id").children().remove();
  // Create options and append to the list
}
// Rest of Ajax call

As you can see, i didn't put the code that create the options and put them inside the list, but a simple search will have plenty of results about this. The idea is simple though.