2014-03-05 70 views
2

我有兩個模型組和鏡頭。從我的#show頁面組中,我需要一個模式窗口,可以顯示我所有鏡頭的列表。下面是相關代碼...Rails顯示從另一個模型的索引模式的引導模式

應用程序/視圖/組/ show.html.erb

<%= link_to "Add Exsisting Shot", shots_path, id: "shot-modal", remote: true %> 

應用程序/視圖/張/ modal.js.erb

$("#shot-modal").html("<%= escape_javascript(render 'modal') %>") 
$("#shot-modal").modal("show") 

應用程序/控制器/ shots_controller.rb

def index 
    @shots = Shot.all 
    respond_to do |format| 
     format.html # index.html.erb 
     format.js # index.html.erb 
     format.json { render json: @shots } 
    end 
    end 

當我點擊「添加現有射擊」鏈接,我做AA型號排序的,輪流在誰屏幕灰色的,但我不是獲取任何內容。我可以點擊屏幕上的任何地方,它將我帶回到我的演示頁面。我也沒有在控制檯中發現任何錯誤。

編輯

應用程序/視圖/張/ _modal.html.erb

<div class="modal fade" id="shot-modal" tabindex="-1" role="dialog" aria-labelledby="shot-modal-label" aria-hidden="true"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
     <h4 class="modal-title" id="shot-modal-label">Modal title</h4> 
     </div> 
     <div class="modal-body" id="shot-modal-body"> 
     <table> 
      <tr> 
      <th>Name</th> 
      <th>Comedian</th> 
      <th></th> 
      <th></th> 
      <th></th> 
      </tr> 

     <% @shots.each do |shot| %> 
      <tr> 
      <td><%= shot.name %></td> 
      <td><%= shot.comedian.name %></td> 
      <td><%= image_tag shot.pic.url(:thumb) %></td> 
      </tr> 
     <% end %> 
     </table> 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     <button type="button" class="btn btn-primary">Save changes</button> 
     </div> 
    </div> 
    </div> 
</div> 

回答

1

兩件事情:

1 - 如果你有這樣一個模式:

<div class="modal fade" id="product-modal" tabindex="-1" role="dialog" aria-labelledby="product-modal-label" aria-hidden="true"> 
    <div class="modal-dialog"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
     <h4 class="modal-title" id="product-modal-label">Modal title</h4> 
     </div> 
     <div class="modal-body" id="product-modal-body"> 
     ... 
     </div> 
     <div class="modal-footer"> 
     <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
     <button type="button" class="btn btn-primary">Save changes</button> 
     </div> 
    </div> 
    </div> 
</div> 

那麼你不應該使用$("#product-modal").html(...,因爲你會覆蓋很多重要的div s在模態中。您應該使用$(".modal-body","#product-modal").html(...或如上所述設置模態體的ID並使用$("#product-modal-body").html(...

2 - 渲染不起作用。當你從視圖中運行渲染命令時,它正在尋找一個部分。所以,你的JavaScript實際上應該看起來是這樣的:

$("#product-modal").html("<%= escape_javascript(render 'allshots') %>") 

然後你應該把HTML中app/views/shots/_allshots.html.erb顯示你的鏡頭。

+0

謝謝mccannf ...這很有幫助。請參閱上面添加的修改/添加。當我點擊我的鏈接時,我會看到一個灰色的屏幕,但我沒有看到任何內容。 – Lumbee