使用Laravel中的AJAX / Jquery显示表中的实时搜索结果

时间:2016-12-20 02:25:56

标签: javascript ajax laravel

我想通过我的表格实现实时搜索,但我没有在这里使用数据表。我复制了我在互联网上找到的js,当我尝试搜索某些内容时,它不会返回任何结果。为什么?任何人都可以帮助我吗?

我的观点

@extends('layout.default')
@section('content')
<br><br>
<br><br>
<div class="container">
    <h4>Live Search using Laravel</h4>

    <div class="col-md-6 col-lg-6 pull-right" >

        <p class="pull-right">Click on the zip logo to download the file:<p>

            <a href="/live_search_laravel.zip" download="live-search(laravel).zip">
                <br><br>
                <img border="0" src="/images/ziplogo.png" class="pull-right" alt="AngularJS" width="50" height="42">

            </a>
        </div>



    </div>

    <br>
    <div class="col-md-7 col-lg-6 pull-right">
        <input type="text" class = "form-control" id="search" placeholder="Live Search"></input>
    </div>
    <br><br>
    <div class="col-md-12 col-sm-6 col-xs-12">
        <div class="x_panel">

            <div class="x_content">
                <table class="table table-hover">
                    <thead>
                        <tr>
                            <th>
                                Change File Name
                            </th>
                            <th>
                                Original File Name
                            </th>
                            <th>
                                File Extension
                            </th>
                            <th>
                                Category
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($data as $filename)
                        <tr>
                            <td>
                                {{ $filename->rs_filename }}
                            </td>
                            <td>
                                {{ $filename->original_filename }}
                            </td>
                            <td>
                                {{ $filename->file_extension }}
                            </td>
                            <td>
                                @if($filename->category=="1")
                                {{ "Laravel" }}
                                @endif
                            </td>

                        </tr>
                        @endforeach
                    </tbody>
                </table>

            </div>
        </div>
    </div>


    @stop
    @section('select2_js')
    <script type="text/javascript" src="/js/live_search_laravel/select2.js"></script>

    @stop

我的JS

$("#search").on("keyup", function() {
    var value = $(this).val();
    $("table tr").each(function(index) {
        if (index !== 0) {

            $row = $(this);

            var id = $row.find("th:first").text();

            if (id.indexOf(value) !== 0) {
                $row.hide();
            }
            else {
                $row.show();
            }
        }
    });
});

0 个答案:

没有答案