Link to home
Start Free TrialLog in
Avatar of Peter_Newman
Peter_Newman

asked on

Filter table based on drop down selection

VS2019 ASP.Net MVC  I am trying to filter a table based on the selected value in a drop down list. When I select an Item from the dropdown list, nothing happens, the table is not filtered

@ModelType IEnumerable(Of test.new_bacsreports)
@Code     ViewData("Title") = "Index"     Layout = "~/Views/Shared/_Layout.vbhtml" End Code <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> <h2>Index</h2> <body>     <table id="table_format" class="table table-bordered table-striped table-hover table-list-search">         <thead>             <tr>                 <th>                     @Html.DisplayNameFor(Function(model) model.new_accessed)                 </th>                 <th>                     @Html.DisplayNameFor(Function(model) model.new_downloaddate)                 </th>                 <th>                     @Html.DisplayNameFor(Function(model) model.new_reporttype)                     <select id='filterText' style='display:inline-block' onchange='filterText()'>                         <option disabled selected>Filter By Report</option>                         <option value='INPUT REPORT'>INPUT REPORT</option>                         <option value='ADDACS REPORT'>ADDACS REPORT</option>                         <option value='All Reports'>All Reports</option>                     </select>                 </th>                 <th>                     @Html.DisplayNameFor(Function(model) model.new_sun)                 </th>                 <th></th>             </tr>         </thead>         <tbody id="myTable">             @For Each item In Model                 @<tr>                     <td>                         @Html.DisplayFor(Function(modelItem) item.new_accessed)                     </td>                     <td>                         @Html.DisplayFor(Function(modelItem) item.new_downloaddate)                     </td>                     <td>                         @Html.DisplayFor(Function(modelItem) item.new_reporttype)                     </td>                     <td>                         @Html.DisplayFor(Function(modelItem) item.new_sun)                     </td>                     <td>                         @Html.ActionLink("Details", "Details", New With {.id = item.Id})                     </td>                 </tr>             Next         </tbody>     </table>     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>     <script>         function filterText() {             var rex = new RegExp($('#filterText').val());             if (rex == "/all/") { clearFilter() } else {                 $('.content').hide();                 $('.content').filter(function () {                     return rex.test($(this).text());                 }).show();             }         }         function clearFilter() {             $('.filterText').val('');             $('.content').show();         }     </script> </body>

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of David H.H.Lee
David H.H.Lee
Flag of Malaysia image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial