Rails：使用数据填充模态

我知道这是一个古老的问题，但我无法解决它.. 我想显示一个模式中的评论列表，每个迭代都是特定的。Rails：使用数据填充模态

内容的has_many注释，注释belongs_to的content`

@contents.each do |content| 
content.title 
button_to('read', category_modal_path(:comment_id => content.id), remote: true, :class=> 'modal-trigger2', 'data-target'=>'modal3') 
end

控制器

def category_modal 
@comments = Comment.online.where(content_id: params[:comment_id]) 
respond_to do |format| 
    format.js 
end

模态

<div id="modal3" class="modal modal-fixed-footer"> 
...here I want show the list of comments

category_modal.js

$('#modal3').html(<%= j(render partial: 'shared/modal2', locals: {comments: @comments})%>);

咖啡

$('.modal-trigger2').leanModal()

模态打开，但没有数据...帮助将是非常不错..

来源

2016-07-27 Werner

你检查了ajax的回应吗？如果响应有一些数据。 –

我得到零。可能是我的错误。首先想到的是获取content.id作为模态中的整数，然后在模态内查询..但可能有点粗糙？ – Werner

好了后一个小时的努力，我能够解决您的问题。按着这些次序。

首先从咖啡脚本中删除$('.modal-trigger2').leanModal()。它不需要任何更多。

在category_modal.js下面的代码粘贴

$('#modal3').html("<div href='#modal3' id='content_<%=params[:comment_id] %>'><%= j(render partial: 'shared/modal2', locals: {comments: @comments})%></div>"); 
$('#content_<%=params[:comment_id]%>').leanModal(); 
$('#content_<%=params[:comment_id]%>').trigger('click');

您可能需要在您的类别列表添加method: :get如果您的路线是post型不是那么

@contents.each do |content| 
    content.title 
    button_to('read', category_modal_path(:comment_id =>content.id), remote: true, :class=> 'modal-trigger2',method: :get) 
end

还好现在告诉我是什么问题。基本上它是leanModal的混乱如果你已经使用bootstap模态它不会是问题。

基本上每当我们在任何元素上调用leanModal它停止它默认从现在起，当它的一些点击，它打开它表明这是在点击项目href提及的相应内容的弹出行为i-e Click左右。

所以当我打电话给$('.SomeClass').leanModal()它会为所有具有SomeClass类的项目添加一个点击事件，并在某个点击它并显示内容时打开模式。

因此，在你的情况下，当你打电话给$('.modal-trigger2').leanModal()它简单地为所有内容按钮添加一个点击事件，并在你点击任何内容时打开弹出窗口。它甚至没有向服务器发送ajax调用。正如你知道最初没有在modal3容器中的任何内容，这就是为什么它打开空模态。

所以现在我所做的就是删除这个调用并移动了category_modal.js 中的所有弹出逻辑。所以，无论您何时点击一个内容，它都会向服务器发送一个ajax请求。在JS视图中，我正在做同样的事情，但现在我在comments周围添加了一个包装，并根据您的要求content_id设置了ID。之后，我在这个新创建的包装div上调用leanModal。并触发其上的click事件，所以模态会自动显示。

P.S

你不一定需要下面的代码也将致力于此动态ID的东西。

$('#modal3').html("<div href='#modal3' id='leanModalContainer'><%= j(render partial: 'shared/modal2', locals: {comments: @comments})%></div>"); 
$('#leanModalContainer').leanModal(); 
$('#leanModalContainer').trigger('click');

来源

2016-07-27 19:25:42

非常感谢..真的很好..我会检查..格雷斯Werner – Werner

好吧，请让我知道如果它解决您的问题:) –

到现在..不能让它工作..1。安全警告：另一个网站上的嵌入式

Rails：使用数据填充模态

回答

相关问题