やりたいこと

親のカテゴリを変更すると、子のカテゴリの中身が動的に変わり、子のカテゴリが選択されると、孫のカテゴリも動的に変わるセレクトボックスをつくりたいです。
以下を参考にしました。
Ajaxでセレクトボックスの中身が動的に変わるRailsアプリの作り方(Qiita)
具体的にはUserが
Prefecture(都道府県)→School(学校)→Course(学科)
のカテゴリを動的に選択できるようにしたいです。
今のところPrefecture(都道府県)→School(学校)の2段目までは動いています。

コード

View

users/school.html.erb

<% prefecture_options = Prefecture.order(:id).map { |s| [s.name, s.id, data: { children_path: prefecture_schools_path(s) }] }%>
    <div class="field">
      <%= f.label :prefecture_id,"都道府県" %><br>
      <%= f.select :prefecture_id, prefecture_options, { include_blank: true }, class: 'select-parent' %>
      <span class="pulldown"><i class="fa fa-angle-down" aria-hidden="true"></i></span>     
    </div>

    <% schools = @user.prefecture.try(:schools) || [] %>
    <% school_options = schools.map { |s| [s.name,s.id , data: { grandchildren_path: prefecture_school_courses_path(s) }] } %>
    <div class="field">
      <%= f.label :school_id,"大学名" %><br>
      <%= f.select :school_id, school_options, { include_blank: true }, class: 'select-children' %>
      <span class="pulldown"><i class="fa fa-angle-down" aria-hidden="true"></i></span>     
    </div>

    <% courses = @user.school.try(:courses) || [] %>
    <% course_options = courses.map { |s| [s.name, s.id] } %>

    <div class="field">
      <%= f.label :course_id,"学科名" %><br>
      <%= f.select :course_id, course_options, { include_blank: true }, class: 'select-grandchildren' %>
      <span class="pulldown"><i class="fa fa-angle-down" aria-hidden="true"></i></span>     
    </div>

$(document).on 'turbolinks:load', ->
  replaceSelectOptions = ($select, results) ->
    $select.html $('<option>')
    $.each results, ->
      option = $('<option>').val(this.id).text(this.name)
      $select.append(option)

#都道府県から大学名
  replaceChildrenOptions = ->
    childrenPath = $(@).find('option:selected').data().childrenPath
    $selectChildren = $(@).closest('form').find('.select-children')
    if childrenPath?
      $.ajax
        url: childrenPath
        dataType: "json"
        success: (results) ->
          replaceSelectOptions($selectChildren, results)
        error: (XMLHttpRequest, textStatus, errorThrown) ->
          console.error("Error occurred in replaceChildrenOptions")
          console.log("XMLHttpRequest: #{XMLHttpRequest.status}")
          console.log("textStatus: #{textStatus}")
          console.log("errorThrown: #{errorThrown}")
    else
      replaceSelectOptions($selectChildren, [])

#大学名から学科名
  replaceGrandChildrenOptions = ->
    grandchildrenPath = $(@).find('option:selected').data().grandchildrenPath
    $selectGrandChildren = $(@).closest('form').find('.select-grandchildren')
    console.log($(@).find('option:selected').data().grandchildrenPath)

    if grandchildrenPath?
      $.ajax
        url: grandchildrenPath
        dataType: "json"
        success: (results) ->
          replaceSelectOptions($selectGrandChildren, results)
        error: (XMLHttpRequest, textStatus, errorThrown) ->
          console.error("Error occurred in replaceChildrenOptions")
          console.log("XMLHttpRequest: #{XMLHttpRequest.status}")
          console.log("textStatus: #{textStatus}")
          console.log("errorThrown: #{errorThrown}")
    else
      replaceSelectOptions($selectGrandChildren, [])

  $('.select-parent').on
    'change': replaceChildrenOptions

  $('.select-children').on 
    'change': replaceGrandChildrenOptions

Controller

class SchoolsController < ApplicationController
  def index
    prefecture = Prefecture.find(params[:prefecture_id])
    render json: prefecture.schools.select(:id, :name)
  end
end

class CoursesController < ApplicationController
  def index
    school = School.find(params[:school_id])
    render json: school.courses.select(:id, :name)
  end
end

Model

class User < ApplicationRecord
  belongs_to :prefecture, optional: true
  belongs_to :school, optional: true
  belongs_to :course, optional: true
end

class Prefecture < ApplicationRecord
  has_many :schools, ->{ order(:id) }
end

class School < ApplicationRecord
  belongs_to :prefecture, optional: true
  has_many :courses, ->{ order(:id) }
end

class Course < ApplicationRecord
  belongs_to :school, optional: true
end

Routing

Rails.application.routes.draw do
  resources :users do
   collection do
     get '/:id/school' => 'users#school', as: "school"
   end
  end
  resources :prefectures, only: [] do
    resources :schools, only: :index do
      resources :courses, only: :index
    end
  end
end

困ってるところ

子カテゴリ(学校)の決定後、
coffeescript内のconsole.log($(this).find('option:selected').data().grandchildrenPath);
がundefinedとなり、孫のカテゴリ(学科)が変化しない。

お詳しい方、ぜひともご教授ください。
よろしくお願いします。