JQuery dataTable不适用于haml - Ruby - (sinatra)

时间:2014-11-06 08:44:08

标签: javascript jquery css datatable haml

我正在尝试在Sinatra的ruby项目中使用dataTable。

而不是HTML页面使用HAML文件。

我的第一个想法是制作一个我们可以创建的普通表,如果我们通过我们的数组循环,那就很好了。但是因为我们想把这个表用作带有JQuery&的数据表。 javascript,我们遇到了一些问题。

为了解决问题所在,我在每个TableRow中创建了一个包含数据的简单haml表。

%table{:id => "test"}
  %thead
    %tr
      %th data1
      %th data2
  %tbody
    %tr
      %td data3
      %td data14
    %tr
      %td data15
      %td data16
    %tr
      %td data17
      %td data18

所以当我在DataTables.net上看到安装手册时,它说我们必须导入CSS-Styling和2个jquery文件。

所以在我的laout.haml文件中这么说:

!!!
%html
  %head
    %meta{:charset => 'utf-8'}
    %title tooltitle 
    %link{:href => "./css/jquery-ui-1.10.4.css", :rel => "stylesheet"}/
    %link{:charset => "utf-8", :href => "./css/2close.css", :media => "screen", :rel =>     "stylesheet", :type => "text/css"}/
    %link{:href => "./css/multi-select.css", :media => "screen", :rel => "stylesheet", :type => "text/css"}/
    %link{:href => "./css/login.css", :media => "screen", :rel => "stylesheet", :type => "text/css"}/
    %link{:href => "./DataTables-1.10.3/media/css/jquery.dataTables.min.css", :media => "screen", :rel => "stylesheet", :type => "text/css"}/
    %script{:src => "./scripts/jquery-2.1.0.js",:type => "text/javascript"}
    %script{:src => "./scripts/jquery-ui-1.10.4.custom.js", :type => "text/javascript"}
    %script{:src => "./scripts/jquery.multi-select.js", :type => "text/javascript"}
    %script{:src => "./DataTables-1.10.3/media/js/jquery.js", :type => "text/javascript"}
    %script{:src => "./DataTables-1.10.3/media/js/jquery.dataTables.min.js", :type => "text/javascript"}**  
    %script{:src => "./scripts/scripts.js", :type => "text/javascript"}
    %script{:src => "./scripts/test.js"}  

所以你可以看到,我们正在使用多个jquery文件和多个css文件! 您可能认为链接不正确==>我们之前已经检查过了。 我们有公共目录,里面有DataTables文件夹。 其他Javascript文件和CSS文件可以与我们的网站一起使用。

最后但同样重要的是,我们必须启动DataTable:

:javascript
  $(document).ready( function() 
  {
  $('#test').DataTable();

  }

这是表格的截图:

enter image description here

1 个答案:

答案 0 :(得分:0)

确定我自己的问题! 我必须使用数据表iniatie来表示这个表,

使用$(document).ready(function()

 $('#test').DataTable();

我只是想知道如果我不使用load语句,为什么这实际上有效。 在Datatables.net - 网站上,这是您唯一需要做的事情!