Ruby on Rails ajax弹出消息

Question

我在我的ruby on rails应用程序中使用了bootstrap。我有时会使用弹出窗口向用户显示消息。我创建了以下css和html行：

.modal-dialog {
  display: none;
  position: fixed;
  z-index: 988888; 
  padding-top: 20px; 
  left: 0;
  top: 0;
  width: 100%; 
  height: 100%;
  overflow: auto;
  background-color: rgb(0,0,0); 
  background-color: rgba(0,0,0,0.7);
  margin: 0px!important;
}

.modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 600px;
  height: 550px;
  border-radius: 2px!important;
}

我想显示popup-2

<div class="modal-dialog">
    <div class="modal-content">
       <span class="model_box_close">&times;</span>
       Popup 1
    </div>
</div>

我想显示popup-2

<div class="modal-dialog">
    <div id="message-content" class="modal-content">
       <span class="model_box_close">&times;</span>
       Popup 2
    </div>
</div>

我想做的是用ajax创建消息内容，并将其附加到popup。我如何才能做到这一点。

在ruby on rails中，我们可以像这样执行ruby on rails ajax事件：

$("<%= escape_javascript(render "popupcontent" ) %>").appendTo("#message-content");

我想通过单击ajax的超链接来使用我的消息框。

任何建议，

谢谢。

Answer 1

如果我没理解错的话，您有两条路可供选择，您可以打开模式，然后发出Ajax请求并更新内容，如引导站点中的this示例所示

$('#exampleModal').on('show.bs.modal', function (event) {
  var button = $(event.relatedTarget) // Button that triggered the modal
  var recipient = button.data('whatever') // Extract info from data-* attributes
  // If necessary, you could initiate an AJAX request here (and then do the updating in a callback).
  // Update the modal's content. We'll use jQuery here, but you could use a data binding library or other methods instead.
  var modal = $(this)
  modal.find('.modal-title').text('New message to ' + recipient)
  modal.find('.modal-body input').val(recipient)
})

或者，如果您想单击一个链接并发送一个Ajax请求，并且在完成请求后显示一个模式，那么可以在更新Ajax回调中的内容之后使用.modal('show')。

$("a[data-remote]").on("ajax:success", function() {
  $('#myModal').modal('show')
})