Document search screen with paging and search filter with Asp.net

Question

I have the layout of a search screen, it has to show documents from my sqlserver database. To facilitate the search I put filter and as they are very documents it would be interesting to make pagination. I’m still learning; so if someone has a good tutorial or post some code about it for me to study, I’d really appreciate it. I only know how to do the basic search, how to search certain fields of the database. If anyone can help, I would like to thank you.

Answer 1

I will post the form I use for my ASP.NET MVC searches with Entityframework.

I define a ViewModel with the parameter fields and a list of the search results, this class will also have the paging information.

public class BancosViewModel : PagedListViewModel<Banco>
{
    public BancosViewModel()
    {
        Pagina = 1;
        TamanhoPagina = 50;
    }

    [Display(Name = "Página")]
    public int Pagina { get; set; }

    [Display(Name = "Itens por página")]
    public int TamanhoPagina { get; set; }

    [JsonIgnore]
    public IPagedList<Banco> Resultados { get; set; }

    //TODO: adicionar filtros de pesquisa
    public string Descricao { get; set; }
}

The search is done in my Controller Action

public async Task<ActionResult> Indice(BancosViewModel viewModel)
{        
    var query = _db.Bancos.AsQueryable();

    //TODO: parâmetros de pesquisa
    if (!String.IsNullOrWhiteSpace(viewModel.Descricao))
    {
        var descricaos = viewModel.Descricao?.Split(' ');
        query = query.Where(a => descricaos.All(descricao => a.Descricao.Contains(descricao)));
    }

    viewModel.Resultados = await query.OrderBy(a => a.Descricao).ToPagedListAsync(viewModel.Pagina, viewModel.TamanhoPagina);

    return View("Indice", viewModel);
}

The method ToPagedListAsync is part of the package Pagedlist.Entityframework

The View that demonstrates the search results is as follows

@using Syns.Web.Areas.Cadastros.ViewModels
@model BancosViewModel
@{
    ViewBag.Title = "Bancos";
}

<div class="panel panel-default">
    <div class="panel-heading">
        Pesquisa - @ViewBag.Title
    </div>
    <div class="panel-body">
        <div class="row form-group">
            <div class="col-lg-12">
                @using (Html.BeginForm("Indice", "Bancos"))
                {
                    <div class="row form-group">
                        <div class="col-md-4 col-xs-6">
                            @Html.LabelFor(model => model.Descricao, htmlAttributes: new { @class = "control-label" })
                            @Html.EditorFor(model => model.Descricao, new { htmlAttributes = new { @class = "form-control" } })
                            @Html.ValidationMessageFor(model => model.Descricao, "", new { @class = "text-danger" })
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-12">
                            <div class="btn-group">
                                <button type="submit" class="btn btn-default" id="submit" name="submit">Pesquisar</button>
                            </div>
                        </div>
                    </div>
                }

            </div>
        </div>
        <div class="row">
            <div class="col-lg-12">
                <div id="pesquisa">
                    <table class="table-bordered table-striped table-condensed cf table-hover col-md-12">
                        <thead class="cf">
                            <tr>
                                <th class="col-lg-2 col-md-3 col-xs-12"></th>
                                <th>
                                    Número
                                </th>
                                <th>
                                    Descrição
                                </th>
                            </tr>
                        </thead>

                        <tbody>
                            @foreach (var item in Model.Resultados)
                            {
                                <tr>
                                    <td data-title="">
                                        <div class="btn-group">
                                            <a class="btn btn-default" id="editar" title="Editar" href="@Url.Action("Editar", new { id=item.BancoId})"><i class="fa fa-edit fa-align-left"></i></a>
                                            <a class="btn btn-default" id="detalhes" title="Detalhes" href="@Url.Action("Detalhes", new {id=item.BancoId})"><i class="fa fa-eye fa-align-right"></i></a>
                                            <a class="btn btn-default" id="Deletar" title="Excluir" href="@Url.Action("Excluir", new { id=item.BancoId })"><i class="fa fa-trash fa-align-right"></i></a>
                                        </div>
                                    </td>
                                    <td data-title="Numero">
                                        @item.Numero
                                    </td>
                                    <td data-title="Descricao">
                                        @item.Descricao
                                    </td>
                                </tr>
                            }
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

@Html.PagedListPager(Model.Resultados, page => Url.Action("Pesquisa",
    new BancosViewModel()
    {
        Pagina = page,
        Descricao = Model.Descricao
    }), PagedListRenderOptions.Classic)

The pagination is in charge of the Helper @Html.PagedListPager.