在ajax请求后无法显示twitter bootstrap模式

Question

我想在点击链接时显示模态窗口，但也想做ajax请求以获取需要在模态窗口上显示的对象。

我正在获得需要在模态窗口上显示的内容的响应，但它不会弹出作为模态窗口可能脚本没有被执行。

码

主页

  <%= link_to "New Topic", "#", :class => 'btn primary float-right bootstrap-popover'   %>
  <div id="modal_form_container"></div>

Javascript代码

   $('a.bootstrap-popover').live('click',  function(){
   $(this).unbind('click');

   $.ajax({
          url: "/topics/new",
          type: "GET",
          dataType: "html",


          complete: function() {
            $('loading').hide();
          },

     success: function(data) {

     },

     error:function() {
        }
      }); // End of Ajax

new.js.erb

$('#modal_form_container').html("<%= escape_javascript( render :partial => 'new_form')%>");   
$('#modal_form').modal('show');             

此new_form页面包含要在模态窗口中显示的内容

有人可以帮忙吗？

Answer 1

你有没有看过Bootstrap模态管理器 ？ 您可以像这样使用它：

$("a.open-with-ajax-loader").live('click', function(e){
  e.preventDefault();
  $('body').modalmanager('loading');
  $('#id-of-modal-div').modal({
    remote: '/url/to/load'
  });
});

您可以在Bootstrap Modal Manager的实时演示页面上看到这一点（向下滚动一下，查找AJAX演示）。

Answer 2

是因为加载元素没有被隐藏？

$('loading').hide();

这不应该是这样的：

$('#loading').hide();

Answer 3

在你的ajax请求获得成功之后，我认为你必须写下面的代码。

$('#PopupBoxId').modal('show');      // Show the pop-up (modal)
$('#disable_layer').modal('show');   // Show the black overlay

我们必须在ajax请求处理后手动显示弹出窗口。根据我在bootstrap中的小经验。 :)

希望对你有效。