Ruby on rails RubyonRails数据表不工作

我遵循上述步骤，并通过运行安装了git插件

rails plugin install https://github.com/phronos/rails_datatables.git

我只是想在我的Rails页面上找到一些好看的表格。如果有一个更简单的方法来实现这一点而不使用插件，请让我知道

我得到的只是在我的页面上输出这些文本

`<script type="text/javascript"> $(function() { $('#expenses').dataTable({ "oLanguage": { "sSearch": "Search", "sProcessing": 'Processing' }, "sPaginationType": "full_numbers", "iDisplayLength": 25, "bProcessing": true, "bServerSide": false, "bLengthChange": false, "bStateSave": true, "bFilter": true, "bAutoWidth": true, 'aaSorting': [[0, 'desc']], "aoColumns": [ { 'sType': 'html', 'bSortable':true, 'bSearchable':true ,'sClass':'first' },{ 'sType': 'html', 'bSortable':true, 'bSearchable':true },{ 'sType': 'html', 'bSortable':true, 'bSearchable':true },{ 'sType': 'string', 'bSortable':true, 'bSearchable':true ,'sClass':'last' } ], "fnServerData": function ( sSource, aoData, fnCallback ) { aoData.push( ); $.getJSON( sSource, aoData, function (json) { fnCallback(json); } ); } }); }); </script>"`.

`$（function（）{$（'#expenses'）。数据表（{“oLanguage”：{“sSearch”：“Search”，“sProcessing”：“Processing”}，“sPaginationType”：“full_numbers”，“iDisplayLength”：25，“bProcessing”：true，“bserver端”：false，“bLengthChange”：false，“bStateSave”：true，“bFilter”：true，“bAutoWidth”：true，“aaSorting”：[[0'，desc']，“aoColumns]：{'sType'：'html'，'bSortable'：true，'bsearcable'：true，'sClass'：'first'}，{'sType'：'html'，'bSortable'：true}，{'sType'：'html'，bSortable'：true，'bsearcable'：true，'bSortable'，'bsearcable'：true，'bserverdata'：'last'}函数（sSource，aoData，fnCallback）{aoData.push（）；$.getJSON（sSource，aoData，函数（json）{fnCallback（json）；}）；}}}）；“`。

My.html.erb如下所示：

<% @page_title="User Page"%> 

   <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
     <%=javascript_include_tag "jquery.dataTables" %>
     <%=stylesheet_link_tag "jquery-ui-1.9.2.custom" %>

    <script>
    $(function() {
        $( "#tabs" ).tabs();
    });
    </script>

<% if current_user %>
<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Expenses</a></li>
        <li><a href="#tabs-2">Accountant</a></li>
        <li><a href="#tabs-3">Requests (<%=@requests.count%>)</a></li>    
    </ul>
     <div id="tabs-3">
       <p>
        <% if @requests.count != 0 %>
        <h2> Accountant Requests </h2>

        <table >
          <tr>
              <thead>

            <th>First Name</th>
            <th>Last Name</th>
            <th>Email Address</th>
            <th>Accept</th>
            <th>Reject</th>
                </thead>
          </tr>

          <% @requests.each do |request| %>
            <tr>
            <td><%= request.accountant.first_name %></td>
            <td><%= request.accountant.last_name %></td>
            <td><%= request.accountant.email %></td>
            <td><%= link_to 'accept', confirm_accountant_path(:accountant_id => request.accountant_id) %></td>
            <td><%= link_to 'Edit', edit_expense_path(request) %></td>      
            </tr>
          <% end %>
        </tbody>
        </table>
        <% else %>
            <h4> You have no pending requests <h4>
        <% end %>
        </p>
    </div>
    <div id="tabs-2">
       <p>
        <% if @accountants.count != 0 %>
        <h2> Accountant Info </h2>

        <table>
          <tr>
            <th>First Name</th>
            <th>Last Name</th>
            <th>Email Address</th>
          </tr>
          <% @accountants.each do |accountant| %>
            <tr>
            <td><%= accountant.first_name %></td>
            <td><%= accountant.last_name %></td>
            <td><%= accountant.email %></td>        
            </tr>
          <% end %>
        </table>
        <% else %>
            <h4> Add Accountant  <h4>
            <p> You don't have an accountant yet, perhaps consider adding one by e-mail </p>
            <%= render 'add_accountant_form' %>
            <% end %>
        <% end %>
        </p>
    </div>
    <div id="tabs-1">
        <p><% if current_user %>
    <h4> Submit new expense </h4>
    <%= render 'expenses/form' %>
     <% columns = [{:type => 'html', :class => "first"}, {:type => 'html'}, 
    {:type => 'html'}, {:type => nil, :class => "last"}] %>
<%= datatable(columns, {:sort_by => "[0, 'desc']", table_dom_id:"expenses" }) %>
    <table id="expenses" class="datatable">
        <thead>
      <tr>
        <th>Entry Date</th>
        <th>Last Update</th>
        <th>Amount</th>
        <th>User</th>
        <th>Receipt</th>
        <th></th>
        <th></th>
      </tr>
        </thead>
        <% @expenses.each do |user_expense| %>

<tbody>
      <tr>
        <td><%= user_expense.created_at %></td>
        <td><%= user_expense.updated_at %></td>
        <td><%= user_expense.amount %></td>
        <td><%= user_expense.user.username %></td>
            <% if !user_expense.receipt_img.nil? %>
                <td><%= image_tag user_expense.receipt_img.url(:thumb) %></td>
            <% else %>
                <td>Future Button Here</td>
            <% end %>
        <td><%= link_to 'Show', user_expense %></td>
        <td><%= link_to 'Edit', edit_expense_path(user_expense) %></td>
      </tr>
     </tbody>
        <% end %>
    </table>
<% end %></p>
    </div>

</div>

$（函数（）{
$（“#制表符”）.tabs（）；
});






会计要求
名字
姓
电子邮件地址
接受
拒绝
请求。会计师（id）%>
您没有挂起的请求


会计信息
名字
姓
电子邮件地址
加会计
你还没有一个会计，也许考虑通过电子邮件添加一个< /P>


提交新费用
'html'，：class=>“first”}，{:type=>'html'}，
{:type=>html'}，{:type=>nil，:class=>“last”}]>
“[0，'desc']”，表\u dom\u id:“费用”}）%>
参赛日期
最后更新
数量
使用者
收据
未来按钮在这里

我找到了一个更简单的选择：

它工作得很好，我要卸载这个没有工作的插件

以下是我更新的html.erb：

<% @page_title="User Page"%> 

   <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
    <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
 <%=javascript_include_tag "jquery.dataTables"%>
     <%=stylesheet_link_tag "jquery-ui-1.9.2.custom"%>
      <%=stylesheet_link_tag "demo_table"%>



    <script>
    $(function() {
        $( "#tabs" ).tabs();
    });
    $(document).ready(function() {
    $('#expenses').dataTable();
  } );
    </script>



<% if current_user %>
<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Expenses</a></li>
        <li><a href="#tabs-2">Accountant</a></li>
        <li><a href="#tabs-3">Requests (<%=@requests.count%>)</a></li>    
    </ul>
     <div id="tabs-3">
       <p>
        <% if @requests.count != 0 %>
        <h2> Accountant Requests </h2>

        <table >
          <tr>
              <thead>

            <th>First Name</th>
            <th>Last Name</th>
            <th>Email Address</th>
            <th>Accept</th>
            <th>Reject</th>
                </thead>
          </tr>

          <% @requests.each do |request| %>
            <tr>
            <td><%= request.accountant.first_name %></td>
            <td><%= request.accountant.last_name %></td>
            <td><%= request.accountant.email %></td>
            <td><%= link_to 'accept', confirm_accountant_path(:accountant_id => request.accountant_id) %></td>
            <td><%= link_to 'Edit', edit_expense_path(request) %></td>      
            </tr>
          <% end %>
        </tbody>
        </table>
        <% else %>
            <h4> You have no pending requests <h4>
        <% end %>
        </p>
    </div>
    <div id="tabs-2">
       <p>
        <% if @accountants.count != 0 %>
        <h2> Accountant Info </h2>

        <table>
          <tr>
            <th>First Name</th>
            <th>Last Name</th>
            <th>Email Address</th>
          </tr>
          <% @accountants.each do |accountant| %>
            <tr>
            <td><%= accountant.first_name %></td>
            <td><%= accountant.last_name %></td>
            <td><%= accountant.email %></td>        
            </tr>
          <% end %>
        </table>
        <% else %>
            <h4> Add Accountant  <h4>
            <p> You don't have an accountant yet, perhaps consider adding one by e-mail </p>
            <%= render 'add_accountant_form' %>
            <% end %>
        <% end %>
        </p>
    </div>
    <div id="tabs-1">
        <p><% if current_user %>
    <h4> Submit new expense </h4>
    <%= render 'expenses/form' %>
    <table id="expenses" class="display">
        <thead>
      <tr>
        <th>Entry Date</th>
        <th>Last Update</th>
        <th>Amount</th>
        <th>User</th>
        <th>Receipt</th>
        <th></th>
        <th></th>
      </tr>
        </thead>

            <tbody>
        <% @expenses.each do |user_expense| %>


      <tr>
        <td><%= user_expense.created_at %></td>
        <td><%= user_expense.updated_at %></td>
        <td><%= user_expense.amount %></td>
        <td><%= user_expense.user.username %></td>
            <% if !user_expense.receipt_img.nil? %>
                <td><%= image_tag user_expense.receipt_img.url(:thumb) %></td>
            <% else %>
                <td>Future Button Here</td>
            <% end %>
        <td><%= link_to 'Show', user_expense %></td>
        <td><%= link_to 'Edit', edit_expense_path(user_expense) %></td>
      </tr>

        <% end %>
    </tbody>
    </table>
<% end %></p>
    </div>

</div>

$（函数（）{
$（“#制表符”）.tabs（）；
});
$（文档）.ready（函数（）{
$（“#费用”）.dataTable（）；
} );






会计要求
名字
姓
电子邮件地址
接受
拒绝
请求。会计师（id）%>
您没有挂起的请求


会计信息
名字
姓
电子邮件地址
加会计
你还没有一个会计，也许考虑通过电子邮件添加一个< /P>


提交新费用
参赛日期
最后更新
数量
使用者
收据
未来按钮在这里