jQuery数据表在Salesforce闪电组件中不起作用

时间:2018-03-16 17:04:02

标签: datatables salesforce salesforce-lightning

我正在尝试在Salesforce闪电组件中添加jQuery数据表。这是代码。根本没有加载。我做错了什么?

<ltng:require scripts="{!join(',','//cdn.datatables.net/1.10.4/css/jquery.dataTables.css'
                        ,'//code.jquery.com/jquery-1.12.4.js'
                        ,'//cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js'
                        ,'//cdn.datatables.net/buttons/1.5.1/js/dataTables.buttons.min.js'
                        ,'//cdn.datatables.net/buttons/1.5.1/js/buttons.flash.min.js'
                        ,'//cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js'
                        ,'//cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/pdfmake.min.js'
                        ,'//cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.32/vfs_fonts.js'
                        ,'//cdn.datatables.net/buttons/1.5.1/js/buttons.html5.min.js'
                        ,'//cdn.datatables.net/buttons/1.5.1/js/buttons.print.min.js')}"
            afterScriptsLoaded="{!c.afterscriptsLoaded}"/>



<table id="showContacts" class="slds-table slds-table--bordered slds-table--cell-buffer">
          <thead>
            <tr class="slds-text-title--caps">

                <th class="slds-is-sortable slds-text-title--caps">

                  <span class="slds-truncate" title="EID">EID</span>  

               </th>

               <th class="slds-is-sortable slds-text-title--caps">

                  <span class="slds-truncate" title="Name">Name</span>

               </th>
          </tr>
  </thead>
  <tbody>
      <tr>
         <td scope="row">
             <div class="text-wrap">10887738</div>
         </td>
         <td>
            <div class="slds-truncate  text-wrap" title="Adam Will"><a href="javascript:void(0);">Adam, Will</a></div>
         </td>
    </tr>
</tbody>
</table>


({
afterscriptsLoaded : function(component,event,helper){
    j$('[id$="showStudents"]').DataTable({
            "scrollY": "260px",
            "scrollCollapse": true,
            "paging": true,
            "searching": true,
            "ordering": true,
            "info": true,
            "dom": 'Bfrtip',
            "buttons": [
                        'copy',
                        {extend: 'csv',title: 'Criteria export'},
                        {extend: 'excel',title: 'Criteria export'},
                        {extend: 'pdf',title: 'Criteria export'},
                        'print'
            ]
        } );
},


})

我的问题是关于如何在Salesforce中的闪电组件上显示此表?每当我加载页面时,我都会看到一个空白页面。

注意:我正在展示一个示例表。

0 个答案:

没有答案