anchor.diff:      <table id="creLineTable" data-toggle="table" data-pagination="true" data-mobile-responsive="true" data-sortable="true"   data-detail-view="true" data-detail-formatter="detailFormatter">
           <thead>
           <tr>
  -            <th class="hidden">Allele Frag</th>
  -            <th class="hidden">Shown</th>
               <th>MGI Allele</th>
               <th>Allele Type</th>
               <th>Availability</th>
  
positive.code: <%@taglib prefix="t" tagdir="/WEB-INF/tags" %>
  
  <script>
      function detailFormatter(index, row) {
          console.log(row);
          $.ajax({
              url: row[0],
              type: 'GET',
              success: function (data) {
                  $('#orderAllele' + index).html(data);
              }
          });
          return "<div class='container'>" +
              '<div id="orderAllele' + index + '" class="col-12">' +
              "     <div class=\"pre-content\">\n" +
              "                        <div class=\"row no-gutters\">\n" +
              "                            <div class=\"col-12 my-5\">\n" +
              "                                <p class=\"h4 text-center text-justify\"><i class=\"fas fa-atom fa-spin\"></i> A moment please while we gather the data . . . .</p>\n" +
              "                            </div>\n" +
              "                        </div>\n" +
              "                    </div>" +
              '</div>' +
              '</div>';
      }
  </script>
  
  
negative.code:         </thead>
          <tbody>
          <c:forEach var="row" items="${orderRows}" varStatus="status">
              <tr data-link="${baseUrl}/allelesFrag/${row.mgiAccessionId}/${row.encodedAlleleName}?${creLineParam}" data-shown="false">
                  <td>
                      <span class="text-dark" style="font-size: larger; font-weight: bolder;">${row.markerSymbol}<sup>${row.alleleName}</sup></span>
                  </td>
  