Rails 5: Как загрузить Datatable Javascript в частичном представлении HTML - PullRequest
Новая
       8

Rails 5: Как загрузить Datatable Javascript в частичном представлении HTML

0 голосов
/ 24 сентября 2018

Я пытаюсь загрузить данные в одном из моих частичных представлений, которое является просто таблицей.Однако данные не отображаются, только HTML-код в частичном «результатах».

Сценарии - это родительский каркас, который был создан.Результаты - это частичная таблица, которую я отображаю в индексе Сценариев:

В конечном итоге мой вопрос таков: имеет ли _results.html.erb доступ к файлу sceanrios.coffee?

project \ app\ views \ scenarios \ _results.html.erb: 

<table id="example" class="display" style="width:100%">
  <thead>
  <tr>
    <th>Submitter</th>
    <th>Scenario Name</th>
    <th>Options</th>
    <th colspan="8"></th>
  </tr>
  </thead>
  <tbody>
  <% @scenarios.each do |scenario| %>
    <tr>
      <td class="text-left"><%= scenario.submitter %></td>
      <td class="text-left"><%= scenario.scenario_name %></td>
      <td><%= render 'options', scenario: scenario %></td>
    </tr>
  <% end %>
  </tbody>
</table>

project \ app \ assets \ javascripts \ scenarios.coffee: 

jQuery ->
  $(document).ready ->
    console.log("Working!")
    $('#example').dataTable()

Application.js: 

//= require rails-ujs
//= require jquery
//= require jquery_ujs
//= require dataTables/bootstrap/3/jquery.dataTables.bootstrap
//= require dataTables/jquery.dataTables
//= require turbolinks
//= require_tree .

Ошибки браузера: 

Uncaught TypeError: Cannot read property 'defaults' of undefined
    at jquery.dataTables.bootstrap.self-131f13015a9da63d8ed71f09b1c89ebd2fc8c81f1b2032430e06b8547d03f943.js?body=1:48
    at jquery.dataTables.bootstrap.self-131f13015a9da63d8ed71f09b1c89ebd2fc8c81f1b2032430e06b8547d03f943.js?body=1:40
    at jquery.dataTables.bootstrap.self-131f13015a9da63d8ed71f09b1c89ebd2fc8c81f1b2032430e06b8547d03f943.js?body=1:42

Uncaught TypeError: $(...).dataTable is not a function
    at HTMLDocument.<anonymous> (scenarios.self-8ab21e2e580c359da8a7fb9d7d533ce24740a882e2519d4675b5c305690a9b97.js?body=1:3)
    at fire (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?body=1:3233)
    at Object.fireWith [as resolveWith] (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?body=1:3363)
    at Function.ready (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?body=1:3583)
    at HTMLDocument.completed (jquery.self-bd7ddd393353a8d2480a622e80342adf488fb6006d667e8b42e4c0073393abee.js?body=1:3618)

Uncaught TypeError: Cannot read property 'LL_onclickHanlderExist' of null
    at window.LL_CustomUI.LL_CustomUI.animation.LL_CustomUI.animation.addClickHandler (hostui_animation.js?rnd=0.7801729638396486:1)

Ответы [ 2 ]

0 голосов
/ 24 сентября 2018

Я получил его на работу, но с моим кодом могло быть несколько проблем:

  1. сделал это изменение в scenarios.coffee:

    $. NoConflict ()jQuery (документ) .ready ($) -> $ ('# пример'). DataTable () return

  2. Убедитесь, что у вас требуется только одна версия jquery.Проверьте ваш application.js и заголовок макета приложения.

  3. Убедитесь, что ядро ​​jquery загружено до jatery для datatables.

0 голосов
/ 24 сентября 2018

Имеет ли _results.html.erb доступ к файлу scenarios.coffee?

Да, так и должно быть.Поскольку scenarios.coffee является активом, специфичным для контроллера , означающим, что он будет доступен всем scenarios_controller#actions, которые в конечном итоге будут доступны уважаемым представлениям, вызываемым их уважаемыми действиями.

...