Rails：使用 ajax 填充引导下拉列表

Posted 2023-02-22

【中文标题】Rails：使用 ajax 填充引导下拉列表

【英文标题】：Rails: Populating bootstrap dropdown with ajax

【发布时间】：2012-10-04 19:34:19

【问题描述】：

我目前有一个显示通知的下拉菜单

<li class="notifications dropdown"> 
  <a class="dropdown-toggle" id="dLabel" role="button" data-remote="true" data-toggle="dropdown" data-target="#" href="/notifications"><i class="icon-user"></i> Notifications</a>
  <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
  </ul>
</li>

ul 下拉菜单是空的，但是在单击链接时，我想用 rails 中的数据填充菜单。

我目前在 notifications.js.erb 中有这个

$(".nav li.notifications .dropdown-menu").remove();
$(".nav li.notifications").append("<%= escape_javascript(render('users/notifications', notifications: @notifications)) %>");

通常我会将下拉链接设置为远程，但由于我使用的是引导程序的下拉列表，因此不会向 Notifications.js.erb 发送请求。如何手动调用那里的代码？

【参考方案1】：

我会添加 JavaScript 代码来进行调用：

$(document).ready(function() 
    $('#dLabel').click(function() 
        // Only call notifications when opening the dropdown
        if(!$(this).hasClass('open')) 
           $.ajax(
              type: "GET",
              url: "/notifications",
              async: false,
              dataType: "script"
           );
        
    );
);

你也可以让它异步，并在菜单中临时放置一个加载图标...