导轨/面框 - 使用远程功能更新

Question

搜索了这个问题，但找不到解决方案。

我有一个表单，其中的元素被部分替换，具体取决于表单中先前元素的选择(例如 - 一旦用户选择了"原点"，表单将使用所选原点中可用的任何目的地更新"目的地"collection_select(。这工作正常..除了我希望表单在面框弹出窗口中以模式显示。

目前，面框弹出窗口正确加载表单，但是表单元素上的onchange操作似乎没有更新...

在视野中：
<%= link_to "New Delivery", new_delivery_requests_path, :remote => true %>

远程调用(views/delivery_requests/new.js.erb(：
$.facebox('<%= escape_javascript(render 'new') %>')

新布局(views/delivery_requests/new.html.erb(：

<%= form_for @price_update do |f| %>
    <% if @price_update.errors.any? %>
    <h2>Errors:</h2>
    <ul>
        <% @price_update.errors.full_messages.each do |message|%>
        <li><%= message %> </li>
        <% end %>
    </ul>
    <% end %>
    <br />
    <table>
        <tr> 
            <td><%= f.label "Select origin location: "%> </td> 
            <td><%= collection_select(:route, :origin_id,  @origins,  :id, :name, 
            { :prompt   => "Please select an origin" },
            { :onchange => "#{remote_function(
                :url  => { :action => "update_destinations"}, 
                :with => "'origin_id='+value")}",
                :id => "origin_select"} )%>
            </td>
        </tr>
        <tr>
            <td><%= f.label "Select destination location: "%> </td>
            <td><div id="destinations">
                <%= collection_select(:route, :destination, 
                @available_routes, :id, :destination, 
                { :prompt   => "Please select an origin first" }, { :disabled => "disabled" })%></div></td>
        </tr>               
        <tr>
            <td><%= f.label "Current Prices: "%> </td>
            <td>
                <div id="current-prices-table"></div>
            </td>
        </tr>   
        <tr>
            <td><%= f.label "Please select price option" %></td>
            <td>
                <div id = "price-selection"></div>
            </td>
        </tr>
        <tr>
            <td><%= f.label "Priority" %></td>
            <td><%= f.label "Price Per Gram" %></td>
            <td><%= f.label "Price per cm3" %></td>
        </tr>
        <tr>
            <td><div id="priority-label"></div></td>
            <td><%= f.text_field :new_price_per_gram, :id => "price_per_gram_textfield" %></td>
            <td><%= f.text_field :new_price_per_vol, :id => "price_per_vol_textfield" %></td>
        </tr>
    </table>
    <br />
    <%= f.submit "Update Prices"%>  
<% end %>

以及delivery_requests控制器中的更新目标操作：

def update_destinations
    # updates the available list of destinations after an
    # origin location has been chosen when making a new delivery request
    sel_origin = Location.find(params[:origin_id])
    @available_routes = Route.find_available_routes(sel_origin.name)
    render :update do |page|
      page.replace_html 'destinations', :partial => 'destinations_select', :object => @destinations
    end
  end

我对rails相当陌生 - 任何建议都会被理解。

Answer 1

今晚我一直在为此苦苦挣扎，终于想出了一个答案。您需要引用已打开的面框。这就是你要做的，让你的东西工作。

def update_destinations
# updates the available list of destinations after an
# origin location has been chosen when making a new delivery request
sel_origin = Location.find(params[:origin_id])
@available_routes = Route.find_available_routes(sel_origin.name)
render :update do |page|
    page << "jQuery('#facebox .content #destinations').replaceWith(#{(render :partial => 'destinations_select', :object => @destinations).to_json})"       
end
end

我必须感谢jQuery .on没有使用动态DOM/HTML，这导致我 https://github.com/ihower/facebox_render/blob/master/lib/facebox_render.rb 我构建答案的地方。