AsiaH9/modules/announcement/annc_index12.html.erb

<div class="i-annc  index-announcement-12 {{display}}">
  <h3 class="i-annc__page-title">{{page-title}}</h3>
  <table class="i-annc__table  table  table-striped dt-responsive">
    <thead>
      <tr>
        <th class="i-annc__th  i-annc__th--date all" id='date'>{{date-head}}</th>
        <th class="i-annc__th  i-annc__th--title all" id='title'>{{title-head}}</th>
        <th class="i-annc__th  i-annc__th--category min-tablet" id='category'>{{category-head}}</th>
        <th class="i-annc__th  i-annc__th--view min-tablet" id='view-count'>{{view-count-head}}</th>
      </tr>
    </thead>
    <tbody data-level="0" data-list="announcements">
      <tr>
        <td class="i-annc__postdate" headers='date'><span class="i-annc__postdate-content" date-format="%Y-%m-%d">{{postdate}}</span></td>
        <td class="i-annc__content" headers='title'>
          <span class="i-annc__status-wrap" data-list="statuses" data-level="1">
            <span class="i-annc__status label status {{status-class}}">{{status}}</span>
          </span>
          <a class="i-annc__title" href="{{link_to_show}}">{{title}}</a>
        </td>
        <td class="i-annc__category" headers='category'>{{category}}</td>
        <td class="i-annc__view-count" headers='view-count'>{{view_count}}</td>
      </tr>
    </tbody>
  </table>
</div>
{{pagination_goes_here}}

<script>
$('.i-annc__table').each(function(){
  if($(this).find('thead').length!=0 && $(this).find('td').length!=0 && !$(this).hasClass('dataTable')){
    $(this).DataTable({
      searching: false,
      paging:   false,
      ordering: false,
      info:     false,
      autoWidth: false
    });
  }
});;
</script>