Rails AJAX Datatables中适配打开Modal的按钮代码实现问题

适配方案 #

直接在你现有dt_actions方法中追加Modal按钮的构造逻辑即可，完整代码如下：

def dt_actions
    links = []
    # 原有查看按钮
    links << h.link_to(h.content_tag(:i, "", class: "fa fa-search") + " View", h.training_provider_client_path(context[:current_provider], object), class: "btn btn-primary btn-xs m-r-5px")
    # 原有编辑按钮
    links << h.link_to(h.content_tag(:i, "", class: "fa fa-pencil") + " Edit", h.edit_training_provider_client_path(context[:current_provider], object), class: "btn btn-default btn-xs m-l-5px")
    # 新增Modal触发按钮
    links << h.link_to(
      h.fa_icon('graduation-cap', text: 'Issue Certificates') + h.fa_icon('chevron-right'),
      "#",
      class: "btn btn-success btn-xs m-l-5px clients-issue-certs-modal-link",
      data: {
        toggle: "modal",
        target: "#choose-course-modal0",
        client_id: object.id
      }
    )
    # 保留你原有的方法返回逻辑即可，例如：
    links.join(' ').html_safe
end

关键适配说明 #

• Rails的link_to方法支持传入data哈希参数，会自动将哈希键转换为对应的data-*HTML属性，下划线会自动转为中划线，因此client_id会自动生成你需要的data-client-id属性
• 按钮内的两个图标直接拼接fa_icon的返回值即可，和你原有ERB模板中的逻辑完全对齐
• 点击触发的目标ModalID和原始代码保持一致，如果你是多实例Modal需要动态生成ID，修改data[:target]的取值即可

内容的提问来源于stack exchange，提问作者Nav