查看rails在行单击时记录bootstrap模式中的详细信息

我一直坚持这个问题很长一段时间，并查看了几个post，但是我无法完全达到我想要的Rails应用程序。 基本上，我希望能够点击页面上的表格行并弹出一个模式，显示该特定记录的所有信息。 以下是我一直想到/尝试过的场景：

1. 使用一些JS在表行中设置data-link属性，如下所示

HTML：

<tr data-link=""> ...

JS：

$("tr[data-link]").dblclick(function() { window.location = $(this).data("link") })

这很好地打开了脚手架生成的show path页面，但是我无法修改它以使用模态并且在模态中为孩子提供相同的数据。

2. 使用data-id和JavaScript加载到模态

HTML：

<tr data-id=""> ...

JS：

 $(function () { $('#showModal').modal({ keyboard: true, backdrop: "static", show: false, }).on('show', function () { }); $(".table-striped").find('tr[data-id]').on('click', function () { debugger; $('#showDetails').html($('
' + 'Kid ID: ' + $(this).data('id') + '' + '
')); $('#showModal').modal('show'); }); }); 

在这种方法中，我能够在行单击上加载模态并且能够访问Kid ID，但是我无法进一步访问记录的其他属性。 例如，我想使用JS设置@Kid = kid.find（id），其中id将是行中提取的ID。 然后，我希望能够编写显示其他元素的通用模态模板（例如kid.first_name，kid.last_name等）。

我完全陷入困境，无法找到任何有助于实现我的目标的方法。 感谢任何帮助，谢谢。

Answer 1

您需要ajax调用记录属性，因为加载页面时， Kid.find(30).first_name不存在。

试试这个：

KidsController

 def show kid = Kid.find(params[:id]) respond_to do |format| format.html { // Usually show.html.erb } format.json do # Return kid as json object result = { first_name: kid.first_name, last_name: kid.last_name } # If you want to return the whole kid record attributes in json: result = kid.attributes.to_json render json: result end end end 

尝试使用/kid/[:id].json来validation您没有收到UnknownFormat错误。

JS

 $(".table-striped").find('tr[data-id]').on('click', function () { var kid_id = $(this).data('id'); $.getJSON("/kid/" + kid_id, function(data) { // Render the modal body here // first_name = data.first_name, last_name = data.last_name etc $('#showDetails').html($('
'+ data.first_name + '
')); $('#showModal').modal('show'); }); }) 

如果您为Kid模型设置了正确的路线，那么这些就是您所需要的。

更新 ：我在result哈希中输入了一个拼写错误。 固定