導軌Best_in_place活化劑不工作呈現由遠程AJAX調用

Question

我有一個HAML表和記錄與通過這個實例變量@academic_classes每個環路部分的清單，我已經放置best_in_place選擇輸入到第二TD對象屬性，是class_category，這裏是我的部分haml中的代碼。

_classes.html.erb

- @academic_classs.all.each do |academic_class| 
    %tr 
    %td= check_box_tag "class_ids[]", academic_class.id 
    %td 
     - unless academic_class.class_category.blank? 
     = best_in_place academic_class, :class_category_id, :as => :select, activator: '#edit-class-category-name_' + academic_class.id.to_s, :collection => ClassCategory.all.map{|m| [m.id, m.name]}, inner_class: "form-control" 
     = link_to 'javascript:void(0)', class: "pull-right", id: 'edit-class-category-name_' + academic_class.id.to_s do 
      .glyphicon.glyphicon-pencil 
     - else 
     %em No Category 
    %td= academic_class.name 
    %td= academic_class.section 
    %td= link_to "javascript: void(0)", "data-href" => "#{academic_class_path(academic_class)}", method: :delete, onClick: "confirmDelete(this)" do 
     .glyphicon.glyphicon-trash 

，我使用引導選項卡切換Javascript組件，但在這裏我使用與遠程調用和渲染的部分，以一個div當我點擊該選項卡中的任何一個。

index.html.erb

<ul class="nav nav-tabs" role="tablist" id="academic_classes_tab"> 
    <li role="presentation" class="active"> 
     <%= link_to "Classes", "#classes_tab", :remote => true, 'data-toggle' => 'tab', 'data-target' => '#classes', id: "classes_tab" %> 
    </li> 

    <li role="presentation"> 
     <%= link_to "Categories", "#categories_tab", :remote => true, 'data-toggle' => 'tab', 'data-target' => '#categories', class: "categories_tab" %> 
    </li> 
    </ul> 

    <div class="tab-content academic_classes"> 
    <div role="tabpanel" class="tab-pane fade in active" id="classes"> 
     <div class="classes"> 
     <%= render "classes" %> 
     </div> 
    </div> 
    <div role="tabpanel" class="tab-pane fade" id="categories"> 
     <div class="categories"> 
     </div> 
    </div> 
    </div> 

現在，當我點擊它採用非侵入式JavaScript選項卡中的任何一個，並呈現偏.classes股利和.categories DIV如上圖

index.js.erb的

if($("#academic_classes_tab li:first-child").hasClass("active")) { 
    $(".classes").html("<%= j render(partial: 'classes') %>") 
    $(".categories").html('') 
    $(".add_classes").html('') 
} else 

if($("#academic_classes_tab li:nth-child(2)").hasClass("active")) { 
    $(".categories").html("<%= escape_javascript(render 'categories').html_safe %>") 
    $(".classes").html('') 
    $(".add_classes").html('') 
} 

時後的股利負載與阿賈克斯我best_in_place除非我刷新頁面，否則選擇激活器不起作用。

這裏有一件事我注意到，當我點擊的最佳位置屬性類的類別名稱的標籤然後單擊激活再次是與鏈接鉛筆字形圖標，你可以在上面看到，該best_in_place工作很好，但我必須在列表中的每個標籤上做這件事情，然後每個相應的激活器也在工作和更新。

你們可以告訴我我做錯了什麼，或者是否有什麼需要在這段代碼中完成？另外請告訴我這段代碼的其他選擇我想使用best_in_place選擇索引頁而不是顯示頁，我可以將它放在每個元素上。現在我已經將對象Id放到激活器中以使其唯一。

Answer 1

刷新部分時遇到同樣的問題，必須使用相同的解決方法，點擊最佳就位範圍才能使激活器工作。這可能不是最好的解決方案，但我的JavaScript將點擊用於渲染部分的相同js.erb文件中的所有標籤。

bips = document.getElementsByClassName('best_in_place'); 
for (var i = 0; i < bips.length; i++) { 
    bips[i].click(); 
} 

Answer 2

在你index.js.erb，重新綁定您的best_in_place域（你應該能夠使用你寫相同的代碼 - 我猜測 - 在application.js文件）。

如果您正在渲染一個帶有best_in_place字段的部分，那麼它們就像純HTML一樣呈現並且尚未綁定。你可以這樣做：

$('.best_in_place').best_in_place(); 

然後你的bip域應該再次工作。我強烈建議爲%tr每個academic_class（如%tr.academic）添加一個類，然後專門調用best_in_place，只針對新渲染的行（而不是重新綁定任何其他best_in_place元素）。添加完課程後，您可以這樣做：

$('.academic .best_in_place').best_in_place();