ANHPHUONGIT.com

1. HTML

<div class="col-md-12 table-responsive" style="height:70vh;overflow-y:scroll">
                        <input id="filter" /> <span style="cursor:pointer" id="clearFilter">Xóa</span>
                        <table class="table table-bordered tableFilter2">
                            <thead>
                                <tr>
                                    <th style="width:50px">STT</th>
                                    <th style="width:50px">Mã dự toán</th>
                                    <th style="width:300px">Tên hạng mục</th>
                                    <th style="width:80px">ĐVT</th>
                                    <th style="width:80px">KL theo HĐ</th>
                                    <th style="width:80px">KL đã NT</th>
                                    <th style="width:80px">KL còn  lại</th>
                                    <th style="width:80px">KL kỳ này</th>
                                    <th style="width:80px">#</th>
                                </tr>
                            </thead>
                            <tbody>
                                @{
                                    var danhSachChiTiet = new Model.GiamSat.mapGS_HoSoNghiemThuKhoiLuong().db.spChiTietHopDong_NghiemThu(Model.ID).ToList();
                                    var listHopDong = danhSachChiTiet.Select(m => m.TenHopDong).ToList().Distinct().ToList();
                                }
                                @foreach (var tenHD in listHopDong)
                                {
                                    <tr>
                                        <th colspan="3">@tenHD</th>
                                        <td hidden></td>
                                        <td hidden></td>
                                        <td></td>
                                        <td></td>
                                        <td></td>
                                        <td></td>
                                        <td></td>
                                        <td></td>
                                    </tr>
                                    foreach (var item in danhSachChiTiet.Where(m => m.TenHopDong == tenHD).ToList())
                                    {
                                        //if (listNghiemThuCT.Count(m=>m.idHopDongChiTiet== item.ID)>0) { continue; }
                                        i++;
                                        <tr class="row_data" data-id="@item.ID">
                                            <td>@i</td>
                                            <td style="max-width:80px" class="searchItem">@item.MaDuToan</td>
                                            <td style="max-width:200px" class="searchItem">@item.HangMuc</td>
                                            <td style="text-align:center">@item.DonViTinh</td>
                                            <td style="text-align:right">@string.Format("{0:#,0.00}", item.KL_TheoHopDong)</td>
                                            <td style="text-align:right">@string.Format("{0:#,0.00}", item.KL_DaNghiemThu)</td>
                                            <td style="text-align:right">@string.Format("{0:#,0.00}", item.KL_ConLai)</td>
                                            <td style="text-align:right" class="searchItem">@string.Format("{0:#,0.00}", item.KL_ConLai)</td>
                                            <td style="text-align:center">
                                                <a onclick="HoSoNghiemThuKL.ThemChiTiet('@Model.ID','@item.ID')">Chọn</a>
                                            </td>
                                        </tr>
                                    }
                                }
                            </tbody>
                        </table>
                    </div>

2. JS

<script>
    ReloadJS(); 
    $("#filter").keyup(function () {
        var text = $(this).val().toLowerCase();
        $(".tableFilter2 tbody tr").hide();
        $(".tableFilter2 tbody tr").each(function () {
            if ($(this).find(".searchItem").text().toLowerCase().indexOf(text) > -1) {
                $(this).show();
            } 
        })
    })
    $("#clearFilter").click(function () {
        $("#filter").val("")
        $("#filter").keyup();
    })
</script>