下拉不使用bootstrap数据表

Question

我遇到的问题是下拉列表没有使用bootstrap数据表。我实际上经历了其他帖子并尝试了各种建议的解决方案，但不幸的是他们都没有为我工作。有人可以请我提供解决方案吗？如果我要取出bootstrap数据表，我的代码工作正常。

@extends('app')
@section('header')
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://cdn.datatables.net/1.10.8/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.8/js/dataTables.bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<link href="https://cdn.datatables.net/1.10.8/css/dataTables.bootstrap.min.css" rel="stylesheet" />
<link href="css/reports.css" rel="stylesheet">
@stop
@section('content')

<h1 class="page-header">Reports Archive</h1>     
<div class="dropdown">
  <a id="drop5" href="#" class="btn btn-default  dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" role="button" aria-expanded="false">
    Zone Options: 
    <span class="caret"></span>
  </a>
  <ul id="menu2" class="dropdown-menu" role="menu" aria-labelledby="drop5">
    <?php $count = 1; ?>
    @foreach ($zones as $zone)
    <li role="presentation" class="{{ $count == 0 ?  'active' : '' }}">
      <a role="menuitem" tabindex="-1" href="#" data-target="#zone{{ $zone->id }}"> {{ $zone->zone_name }}</a></li>
      <?php $count++; ?>
      @endforeach
    </ul>
  </div>

  <div role="tabpanel">
    <!-- hide the below links-->
    <ul class="nav nav-tabs" style="display:none;" role="tablist" id="myTab">
      <?php $count = 1; ?>
      @foreach ($zones as $zone)
      <li role="presentation" class="{{ $count == 0 ?  'active' : '' }}"><a href="#zone{{ $zone->id }}" aria-controls="zone{{ $zone->id }}" role="tab" data-toggle="tab">{{ $zone->zone_name }}</a></li>
      <?php $count++; ?>
      @endforeach
    </ul>

    <!-- Tab panes -->
    <div class="tab-content">
      <?php $count = 1; ?>
      @foreach ($zones as $zone)
      <div role="tabpanel" class="tab-pane fade in {{ $count == 0 ?  'active' : '' }}" id="zone{{ $zone->id }}">
          <h2> {{ $zone->zone_name }}  </h2>
          <table class="table table-hover table-bordered" id="bootstrap-table">
            <thead>
              <tr>
                <th style="vertical-align:middle">#</th>
                <th>
                  <div class="dropdown">
                    <a id="drop5" href="#" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" role="button" aria-expanded="false">
                      Parameter Name: 
                      <span class="caret"></span>
                    </a>
                    <ul id="menu2" class="dropdown-menu" role="menu" aria-labelledby="drop5">
                      @foreach ($zone->parameter as $param)
                      <li role="presentation">
                        <a class="btn btn-link" data-collapse-group="filters" data-target="#{{ $param->id }}" data-toggle="collapse">{{ $param->parameter_name }}</a></li>
                        @endforeach
                      </ul>
                    </div>
                  </th>
                  <th style="vertical-align:middle">Reading Value</th>
                  <th style="vertical-align:middle">User</th>
                  <th style="vertical-align:middle">Status</th>
                  <th style="vertical-align:middle">Timestamp</th>
                  </tr>
                </thead>

                @forelse ($parameters as $param)
                <?php $index = 1; ?>
                @if ($param->zone_id == $zone->id)
                <tbody id="{{ $param->id }}" class="collapse">
                  @foreach ($readings as $reading)
                  @if ($param->id == $reading->parameter_id)
                  <tr>
                    <td>{{ $index }}</td>
                    <td>{{ $reading->parameter->parameter_name }} </td>
                    <td>{{ $reading->reading_value }} </td>
                    <td>{{ $reading->user->name }} </td>
                    <td>{{ $reading->parameter->threshold->getStatus($reading->reading_value) }} </td>
                    <td>{{ $reading->created_at }} </td>
                    <?php $index++; ?>
                    </tr>
                    @endif
                    @endforeach
                  @endif         
                  @empty  
                  <tr><td  colspan="6"><div class="alert alert-warning" role="alert" style = "margin-top: 10px"> Oops! There are no parameters to display here </div></td></tr>
                </tbody>
              </div>
              @endforelse
            </div>
          </table>
        </div>
      <?php $count++; ?>
      @endforeach
    </div>
  </div>
  @stop

@section('scripts')
<script>
$(document).ready(function() {
    $('#bootstrap-table').DataTable(); 
});
</script>
@stop