Rails，尝试用 jQuery 填充模态内容答案

【问题标题】：Rails, trying to fill a modal content with jQueryRails，尝试用 jQuery 填充模态内容
【发布时间】：2016-05-26 19:03:12
【问题描述】：

由于某些原因，我必须用 jQuery 填充 Bootstrap-modal 的内容。在我看来，我得到的很简单：

<div class = "modal fade" id="editArticleForm">
</div>

我有一个编辑按钮，它在我的控制器中调用编辑功能：

def edit

        respond_to do |format|
            format.js
        end     
end

我的edit.js.erb：

$('#editArticleForm').html('<%= j(render partial: "articles/modals/editModalPartial")%>');
$('#editArticleForm').modal('show');

我的部分填充模态：

<div class= "modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="">
          <span>&times;</span>
        </button>
        <h4 class="modal-title">
          Edit Article                
        </h4>

      </div>
      <div class="modal-body" style="max-height: 1000px;">


        <%=form_for @article, url: articles_create_path,remote: true, html: {class: "form-horizontal"} do |f|%>

        <fieldset class="content-group">
          <legend class="text-bold">Images</legend>
          <div class="form-group">
            <label class="col-lg-2 text-semibold">Current image:</label>
            <div class="col-lg-10">
              <%= image_tag @article.image_url(:thumb)%>
            </div>
          </div>


          <div class="form-group">
            <label class="col-lg-2 text-semibold">Change image:</label>
            <div class="col-lg-10">
              <%= f.file_field :image, :class => 'file-input-custom', 'data-show-caption' => true, 'data-show-upload' => false, :accept => 'image/*'%>
            </div>
          </div>

        </fieldset>
        <%= f.fields_for :strings do |fa| %>
        <fieldset class="content-group">
          <legend class="text-bold">Localization</legend>
          <div class="tabbable">

            <div class="tab-content">
              <% @languages.each do |lang| %>
              <%= fa.fields_for lang.id.to_s do |fb| %>

              <div class="tab-pane active" id="basic-justified-tab-<%= lang.id %>">
                <div class="form-group">
                  <label class="col-lg-2 control-label text-semibold"><%= lang.name %> Title: <span class="text-danger">*</span></label>
                  <div class="col-lg-10">
                    <%= fb.text_field :title, :class => 'form-control', :required => 'required' %>
                  </div>
                </div>

                <div class="form-group">
                  <label for="title" class="col-md-4 col-md-offset-1"><%= lang.name %> Text:</label>
                  <%= fb.text_area :text, :style => "height: 250px;", :class => 'wysihtml5 wysihtml5-min form-control', :required => 'required' %>
                </div>
              </div>
              <hr>

              <% end %>
              <% end %>
            </div>
          </div>

        </fieldset>
        <% end %>                              

        <div class="form-group">

          <div class="col-md-2 col-md-offset-8">
            <input type="submit" class="btn btn-success" value="Submit" >
          </div>

        </div>

        <% end %>
      </div>
    </div>
  </div>

屏幕的其余部分变黑，但没有弹出模式。

我做错了什么？

如果您能建议一种更好的方式来加载带有内容的模式，我会很高兴听到它。

任何帮助表示赞赏。

【问题讨论】：

什么？你的部分在哪里？？给出完整路径
@uDaY 在 views/articles/modal/editModalPartial 我做错了吗？

标签： javascript jquery ruby-on-rails twitter-bootstrap

【解决方案1】：

respond_to 块查找与操作名称相同的文件名，然后在文件夹 app/views/controller 中查找视图文件。

所以你的 edit.js.erb 应该在 app/views/articles/ 中，以便 respond_to 块访问视图模板

希望对你有帮助！

【讨论】：

【解决方案2】：

实际的问题是我试图填充：

<div class = "modal fade" id="editArticleForm"> </div>

但是 modal fade div 应该与其他所有内容一起在我的 editModalPartial 中，而在我看来，我应该有一个占位符 div 来填充。

<div id="modal_placeholder"> </div>

我不知道为什么，但它是这样工作的。

【讨论】：