javascript 过滤不同条目上的数据表时出错

xlpyo6sf  于 2023-06-28  发布在  Java
关注(0)|答案(1)|浏览(121)

当我过滤特定行的数据时,比如说第14行,而我的当前视图只显示10个条目,它不显示第14行。但是,如果我将每个视图的条目数增加到25,那么第14行就变得可见。在这种情况下,似乎我当前的视图或显示设置限制了一次显示的行数。
以下是我的观点

function applyFilter() {
        var filterCategory = $('#filter_category').val();
        var filterContentType = $('#filter_content_type').val();

        $('#content tbody tr').hide();

        if (filterCategory != '' || filterContentType != '') {
            $('#content tbody tr').each(function () {
                var category = $(this).data('category');
                var contentType = $(this).data('content-type');

                if (
                    (filterCategory == '' || category == filterCategory) &&
                    (filterContentType == '' || contentType == filterContentType)
                ) {
                    $(this).show();
                }
            });
        } else {
            $('#content tbody tr').show();
        }

        $.ajax({
            url: 'e_learning/admin/content',
            type: 'POST',
            data: {
                category: filterCategory,
                content_type: filterContentType
            },
            success: function (response) {

                $('#content-list').html(response);
            },
            error: function (xhr, status, error) {
                console.error(error);
            }
        });
    }
<div class="card-body bg-dark-transparent" id="form_collapse_list_0" style="">
        <div class="table-responsive bg-white p-2">
            <div id="table_forms_wrapper" class="dataTables_wrapper container-fluid dt-bootstrap4 no-footer">
                <div class="tab-pane fade active show" id="nav-home" role="tabpanel" aria-labelledby="nav-home-tab">
                    <div class="form-row">
                        <div class="form-group col-md-6">
                            <label for="filter_category">Category:</label>
                            <div class="d-flex align-items-center">
                                <select class="form-control" id="filter_category">
                                    <option value="">All Categories</option>
                                    <?php foreach ($rsFilterCategory as $key => $row) {
                                        $selected = (!empty($filter_category) && $filter_category == $row['title']) ? 'selected' : '';
                                        echo '<option value="' . $row["title"] . '" data-category="' . $row["title"] . '" ' . $selected . '>' . $row["title"] . '</option>';
                                    } ?>

                                </select>
                            </div>
                        </div>
                        <div class="form-group col-md-6">
                            <label for="filter_content_type">Content Type:</label>
                            <div class="d-flex align-items-center">
                                <select class="form-control" id="filter_content_type">
                                    <option value="">All Types</option>
                                    <option value="image">Image</option>
                                    <option value="video">Video</option>
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="float-right">
                        <button class="btn btn-success rounded" onclick="applyFilter()">Apply Filter</button>
                        <button class="btn btn-warning rounded" onclick="clearFilter()">Clear Filter</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
jm81lzqq

jm81lzqq1#

如果你使用的是dataTables库,你能把渲染表的代码部分贴出来吗?是否正确设置了“paging”和“pageLength”标志?

相关问题