Javascript 使用AJAX在Ruby中比较变量，然后相应地呈现视图

我对javascript和ruby还不熟悉，我想知道我的方法是否正确，以及如何获得我想要的结果。 我有一个名为events\new.html.erb的视图，允许用户选择集合中的另一个用户选择：

<%= f.collection_select :id,
                                    Customer.where(business_id: current_customer.business_id),
                                    :id,
                                    :full_name,
                                    { prompt: 'Select' },
                                    { id: "colleageselect", onChange: "renderColCal(this)" } %>

<div id = colleaguecal> </div>

这是我的路线：

post 'calendars_controller/calendarChange', to: 'calendars_controller#calendarChange'

然后在控制器“calendars\u controller”（不是events\new视图的events控制器）中，我尝试使用CollegUID：

function renderColCal(select){

    var colleagueID = select.value ;


    document.getElementById("colleaguecal").innerHTML = "Your colleague's calendar";

    $.ajax({
            url: 'calendars_controller/calendarChange',
            data: (
                'colleagueID=' + $('select').val()
            )
        }
    )
}

def calendarChange
    colleagueID = params[:colleagueID]
    colleague = Customer.where(id: :colleagueID )
    @colcalendar = colleague.calendar
    @events = @colcalendar.events

    respond_to do |format|
      format.js {render '/calendars/_showColleague'} 
    end
  end

我想做的是能够使用Ruby的

@events

变量在

events\new

html中呈现部分

\u showcomponent

。因此，每次用户在“选择”集合上选择名称时，都会呈现选定同事的日历视图。目前，我没有得到任何回应使用此代码。请问我该怎么做？我是新来的，所以非常感谢您的解释！谢谢

以下是我要做的：

#app/assets/javascripts/application.js
$(document).on("change", "select#id", function(e) {
   $.get("colleagues/"+  + $(this).val() +"/calendars/1");
});

#config/routes.rb
resources :colleagues do 
   resources :calendars #-> url.com/colleagues/:colleague_id/calendars/:id
end

#app/controllers/calendars_controller.rb
class CalendarsController < ApplicationController
   respond_to :js, :html

   def show
      @colleague = Customer.find params[:colleague_id]
      @calendar  = Calendar.find params[:id] #-> your pattern; not mine
      @events    = @colleague.calendar.events
   end
end

#app/views/calendars/new.js.erb
$(".element").html("<%=j render 'calendars/_showColleague' %>");

#app/assets/javascripts/application.js
$（文档）。在（“更改”、“选择#id”上，函数（e）{
$.get（“同事/”++$（this.val（）++“/calendars/1”）；
});
#config/routes.rb
资源：同事可以
资源：calendars#->url.com/collaborates/：collaborate_id/calendars/：id
结束
#app/controllers/calendars\u controller.rb
类CalendarsController您的模式；不是我的
@events=@component.calendar.events
结束
结束
#app/views/calendars/new.js.erb
$（“.element”）.html（“”）；

--

这将允许您使用返回的

partial

填充DOM，我认为这是您目前最大的问题。还有一些其他的考虑（因为你是新来的）：

您的路线应该是（即应该围绕

日历

对象确定范围）。您已创建了一个超出范围的路由，该路由不受限制

你的JS应该是。像您这样使用JS（尤其是内联JS）有一个习惯，就是因为TurboLink而变得一团糟。只要有可能，就把JS放入

。使用

where

与SQL中的

where

子句相同-它返回多条记录

Find

始终返回一条记录；因此：

阅读有关的信息。您正在为

同事加载
日历
；您需要传递这两个参数（您目前没有这样做）

下面是我要做的：

#app/assets/javascripts/application.js
$(document).on("change", "select#id", function(e) {
   $.get("colleagues/"+  + $(this).val() +"/calendars/1");
});

#config/routes.rb
resources :colleagues do 
   resources :calendars #-> url.com/colleagues/:colleague_id/calendars/:id
end

#app/controllers/calendars_controller.rb
class CalendarsController < ApplicationController
   respond_to :js, :html

   def show
      @colleague = Customer.find params[:colleague_id]
      @calendar  = Calendar.find params[:id] #-> your pattern; not mine
      @events    = @colleague.calendar.events
   end
end

#app/views/calendars/new.js.erb
$(".element").html("<%=j render 'calendars/_showColleague' %>");

#app/assets/javascripts/application.js
$（文档）。在（“更改”、“选择#id”上，函数（e）{
$.get（“同事/”++$（this.val（）++“/calendars/1”）；
});
#config/routes.rb
资源：同事可以
资源：calendars#->url.com/collaborates/：collaborate_id/calendars/：id
结束
#app/controllers/calendars\u controller.rb
类CalendarsController您的模式；不是我的
@events=@component.calendar.events
结束
结束
#app/views/calendars/new.js.erb
$（“.element”）.html（“”）；

--

这将允许您使用返回的

partial

填充DOM，我认为这是您目前最大的问题。还有一些其他的考虑（因为你是新来的）：

您的路线应该是（即应该围绕

日历

对象确定范围）。您已创建了一个超出范围的路由，该路由不受限制

你的JS应该是。像您这样使用JS（尤其是内联JS）有一个习惯，就是因为TurboLink而变得一团糟。只要有可能，就把JS放入

。使用

where

与SQL中的

where

子句相同-它返回多条记录

Find

始终返回一条记录；因此：

阅读有关的信息。您正在为

同事加载
日历
；您需要传递这两个参数（您目前没有这样做）

---

好的，我有几个问题；首先，在您编写了参考资料：同事的路线中，我没有同事模型，他们都是客户，所以我应该将参考资料：客户改为资源：日历吗？（还有，在jQuery中，I$.get（customers/）是否也应该存在？其次，为什么需要使用'new.js.erb'来呈现部分？ThanksI已经实现了您的代码，但没有呈现任何内容？我查看了internet explorer中的开发工具，它显示HTTP404:NOT FOUND-服务器没有找到任何与请求的URI匹配的内容（统一资源标识符）。（XHR）：GET-要回答有关

同事的问题，请输入控制器
Customer.find参数[：同事id]
-路线反映了这一点，我已经做了一个：我没有包括每个文件，因为有些文件不太相关，但每个涉及此问题的文件都包括在内。好的，我有几个问题；首先，在你编写资源的路线中：同事，我没有同事模型，他们都是客户，所以我应该ut资源：客户改为执行资源：日历？（以及在jQuery中是否应I$.get（customers/）也是？其次，为什么需要“new.js.erb”来呈现部分？ThanksI已经实现了您的代码，但没有呈现任何内容？我查看了internet explorer中的开发人员工具，它说HTTP404:未找到-服务器未找到任何与请求的URI（统一资源标识符）匹配的内容。（XHR）：GET-要回答您关于
同事的问题，请输入控制器
Customer.find params[：component_id]
-这些路由反映了我已经创建了一个路由：我没有包含每个文件，因为其中一些文件不太相关，但每个文件都包含