Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Html
<style>
#main-content table {
  table-layout: fixed !important;  
  border-collapse: collapse !important; 
  border: 0px white !important;
}
#main-content table td {
width: 1%;
background-color: white;
border-bottom: 1px solid #ddd;
}

#main-content .table-wrap {
	max-width: 1100px;
}

#main-content .confluenceTh:nth-of-type(1),
#main-content .confluenceTh:nth-of-type(4) {
width: 25%
}


#main-content .confluenceTh:nth-of-type(2),
#main-content .confluenceTh:nth-of-type(5) {
width:50%;
}

#main-content .confluenceTh:nth-of-type(3),
#main-content .confluenceTh:nth-of-type(6) {
width:25%;
}

#inputText {
background-color: lightyellow;
font-size: 20px;
margin-bottom: 15px;
}
</style>

<h3>Search Filter</h3>
<p>Search for a term here (not case-sensitive):</p>
<input type="text" size="5530" id="inputText" onkeyup="filterRows()">

<script>
//For search bar, table filter. 
//G.Walden - 05/31/2018

function filterRows() {
  
  var input, filter, table, tr, i;
  var table = document.getElementsByTagName("table")[0];
  
  input = document.getElementById("inputText");
  filter = input.value.toUpperCase();
  tr = table.getElementsByTagName("tr");
 
  // Loop through all table rows, and hide those not matching.
  // Search matches on values in Alma terms and Aleph terms columns.

 for (i = 0; i < tr.length; i++) {
    var t1 = tr[i].getElementsByTagName("td")[0];
    var t2 = tr[i].getElementsByTagName("td")[2];    
        if (t1) {
          if (t1.innerHTML.toUpperCase().trim().indexOf(filter.trim()) > -1 || t2.innerHTML.toUpperCase().trim().indexOf(filter.trim()) > -1) {
            tr[i].style.display = "table-row";
            var td = tr[i].getElementsByTagName("td");
          } else {
            tr[i].style.display = "none";
          }	
        }
   }
}
</script>

...