我如何在javascript laravel上自动过滤?

问题描述 投票:2回答:1

我想过滤表格时不希望重定向页面,因此如何在javascript中制作表格?这是我的javascript

javascript

    document.getElementById('inputdismissal').value = programId
    $('#modalAddDismissal').modal("show",function(){
    $('#inputdismissal').val(programId).trigger('change');
    $('#inputdismissal').change(function(){
            //fire your ajax call 
        var value = $(this).val().toLowerCase();
        $("#myTable tr").filter(function() {
            $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
        }); 
    })
    })

而且我有这个模态,

modal.php

  <div class="modal-header">
    <input class="form-control" id="inputdismissal" type="text" readonly/>
  </div>
  <div class="modal-body">
    <table id="tblDisNikName" class="table table-sm table-responsive table-hover table-bordered">
                <thead class="thead-dark">
                    <tr>
                        <th scope="col">Select</th>
                        <th scope="col">NIK</th>
                        <th scope="col">Nama</th>
                        <th scope="col">Position</th>
                        <th scope="col">Program</th>
                    </tr>
                </thead>
                <tbody id="myTable" class="cursor-pointer">
                    @foreach($dismissalcrew as $datadis)
                    <tr>
                        <td><input class="dismissalTest" type="checkbox"></td>
                        <td>{{$datadis->employee_nik}}</td>
                        <td>{{$datadis->employee_nama}}</td>
                        <td>{{$datadis->crewprogramposition_name}}</td>
                        <td>{{$datadis->show_name}}</td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
  </div>

我已经将我的值输入inputDismissal,并显示在我的模式中。但是表格根本没有被过滤,当我使用inputDismisal调用模式时如何显示过滤后的表格,我的意思是当我调用模式时会自动进行过滤

javascript laravel
1个回答
0
投票

所以它基本上很简单,我只使用jquery并将值放进去

function filterInput(programId){
  $(document).ready(function(){
    var value = programId.toLowerCase();
    $("#myTable tr").filter(function() {
      $(this).toggle($(this).text().toLowerCase().indexOf(value) > -1)
    });
  });
  $('#modalAddDismissal').modal("show")
}

只需将模态放在过滤器后面即可使用>>

© www.soinside.com 2019 - 2024. All rights reserved.