Question

当用户点击我页面上的按钮时，我有以下通过AJAX请求调用的方法。

def savings_easter_egg
  @savings = params[:savings] if params[:savings]
  return render :partial => "topics/savings", :locals => { :savings => @savings }    
end

我希望这个方法返回一个可以在JqueryUI的模态中显示的部分。

   $.ajax({
      type: 'GET',
      url: '/topics/savings_easter_egg',
      data: {
        savings: data[key]['saving']
      } ,

      success: function(response) {
        $(response).dialog({
          height: 840,
           modal: true,
         });              
      }
    });

如上所示，我正在尝试使用来自我的控制器的响应来生成对话框，但我不确定这一点。文档让我有点困惑：http://jqueryui.com/dialog/#modal

主题/ _savings_easter_egg.slim

#dialog-modal
  p Hi
  = params[:savings]
  = @savings

这是我要传递并在模态中显示的部分内容。现在，我得到了一个模态如何，但它是一条没有文字的细白线。我做错了什么？

Answer 1

jQuery UI对话框基于在创建对话框时已经存在的DOM元素 - 对话框仅显示例如内容。一个DIV，它已经是你网页的DOM结构的一部分。

如果要在对话框中显示部分内容，首先必须将其插入页面，例如用它替换现有的元素内容

jQuery("#your_container").html(YOUR RENDERED PARTIAL)

或替换现有容器（如果您的部分中有一个额外的容器元素，如示例所示）

jQuery("#your_container").replaceWith(YOUR RENDERED PARTIAL)

之后，您将能够为此容器元素

创建一个对话框

jQuery("#your_container").dialog()

编辑：我认为也可以使用动态内容，例如

jQuery("<p>Hello World</p>").dialog()

但我不确定对话框是否会以同样的方式做出反应。我通常在页面中使用一个对话框元素，并将其内容替换为当前所需的内容。

使用JqueryUI对话框类从AJAX渲染rails部分

1 个答案: