Невозможно добавить параметры в таблицы данных в приложении ruby ​​5 - PullRequest
0 голосов
/ 03 мая 2018

Rails 5.1.6 и Ruby 2.4.1

Хотя моя таблица несколько стилизована с использованием начальной загрузки 4, я не смог добавить в нее какие-либо пользовательские параметры (кнопки, colReorder и т. Д.).

CoffeeScript:

$ ->
  $('#results_datatable').DataTable
      buttons: [
        'copyHtml5',
        'excelHtml5',
        'csvHtml5',
        'pdfHtml5']
      destroy: true 
      JQueryUI: true
      colReorder: true
      scrollY: "400px"
      sorting: [[ 0, 'asc' ]]

application.js:

//= require jquery3
//= require jquery_ujs
//= require jquery-ui
//= require popper
//= require bootstrap
//= require bootstrap-sprockets
//= require turbolinks
//= require datatables
//= require_tree .

application.scss:

@import "jquery-ui";
@import "font-awesome";
@import "bootstrap";
@import 'datatables';

снимок экрана с таблицей

Я использовал библиотеку datatables и раньше, но никогда с coffeescript и никогда в приложении RoR (также плохо знакомом с ruby), поэтому вполне возможно, что моя проблема может быть из-за одного (или нескольких) из указанных выше файлов , Или, может быть, я скучаю по важной драгоценности? Любая помощь будет принята с благодарностью!

1 Ответ

0 голосов
/ 04 мая 2018

Транспортировка вашего coffeescript с помощью официального онлайн-инструмента дает следующий вывод:

$(function() {
  return $('#results_datatable').DataTable({
    buttons: ['copyHtml5', 'excelHtml5', 'csvHtml5', 'pdfHtml5'],
    destroy: true,
    JQueryUI: true,
    colReorder: true,
    scrollY: "400px",
    sorting: [[0, 'asc']]
  });
});

Что выглядит правильно синтаксически (хотя вам не нужны запятые в вашем массиве кнопок, они необязательны в Coffeescript). Я предполагаю, что что-то неправильно импортировано, вероятно, плагины buttons и colVis. (хотя они могут быть включены в импортируемый файл datatables js / coffee.

Чтобы исключить это, попробуйте использовать js & css из DataTables CDN , включая все плагины:

<!-- Datatables & Bootstrap 4 -->
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.16/css/dataTables.bootstrap4.min.css">
<script type="text/javascript" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.10.16/js/dataTables.bootstrap4.min.js"></script>

<!-- Buttons -->
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/buttons/1.5.1/css/buttons.bootstrap4.min.css">
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.5.1/js/dataTables.buttons.min.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.5.1/js/buttons.bootstrap4.min.js"></script>


<!-- colVis -->
<script type="text/javascript" src="https://cdn.datatables.net/buttons/1.5.1/js/buttons.colVis.min.js"></script>
...