CODEWITHSUNDEEP
asp.netlistviewdatatables
Jackal
Jackal

Reputation: 3521

jQuery DataTable not working with ListVew ASP.NET

I'm trying to learn to use listviews instead repeaters all the time with Jquery datatables for more functionality but I'm having a hard time trying to bind it with 0 values in database

Here's my code

<asp:ListView ID="lstArtigos" runat="server" GroupPlaceholderID="groupPlaceHolder1" ItemPlaceholderID="itemPlaceHolder1">
    <LayoutTemplate>
        <table id="tblArtigos" class="table table-bordered dataTable">
            <thead class="thead-dark">
                <tr>
                    <th style="width: 20px;">ID</th>
                    <th style="width: 120px">Ref. Cliente</th>
                    <th style="width: 100px">Ref. Interna</th>
                    <th style="width: 100px">Nome</th> 
                    <th style="width: 100px">Estado</th>
                    <th style="width: 100px">Logística</th>
                    <th style="width: 100px">Info Logística</th>
                    <th style="width: 100px">Data Criação</th>
                    <th style="width: 10px;">Editar</th>
                    <th style="width: 10px;">Validar</th>
                    <th style="width: 10px;">Rejeitar</th>
                </tr>
            </thead>
            <asp:PlaceHolder runat="server" ID="groupPlaceHolder1"></asp:PlaceHolder>
        </table>
    </LayoutTemplate>
    <GroupTemplate>
        <tr>
            <asp:PlaceHolder runat="server" ID="itemPlaceHolder1"></asp:PlaceHolder>
        </tr>
    </GroupTemplate>
    <ItemTemplate>
        <td>
            <asp:Label ID="lblIdArtigo" Text="<%# Eval("IdArtigo") %>"></asp:Label></td>
        <td>
            <asp:Label ID="lblRefCliente" Text="<%# Eval("ReferenciaCliente") %>"></asp:Label></td>
        <td>
            <asp:Label ID="lblRefInterna" Text="<%# Eval("ReferenciaInterna") %>"></asp:Label></td>
        <td>
            <asp:Label ID="lblNome" Text="<%# Eval("Nome") %>"></asp:Label></td>
        <td>
            <asp:Label ID="lblEstado" Text="<%# Eval("EstadoArtigo") %>"></asp:Label></td>
        <td>
            <asp:Label ID="lblAprovadoLogistica" Text="<%# Eval("AprovadoLogistica") %>"></asp:Label></td>
        <td>
            <asp:Label ID="lblInformacaoLogistica" Text="<%# Eval("InformacaoLogistica") %>"></asp:Label></td>
        <td>
            <asp:Label ID="lblDataCriacao" Text="<%# Eval("DataCriacao") %>"></asp:Label></td>
        <td class="text-center">
            <asp:ImageButton ImageUrl="/Images/Buttons/edit.png" CssClass="" Width="25" runat="server" />
        </td>
        <td class="text-center">
            <asp:ImageButton ImageUrl="/Images/Buttons/success.png" CssClass="" Width="25" runat="server" />
        </td>
        <td class="text-center">
            <asp:ImageButton ImageUrl="/Images/Buttons/x-button.png" CssClass="" Width="25" runat="server" />
        </td>
    </ItemTemplate>
</asp:ListView>

and in codebehind I bind it with datatable even if it comes empty from database it should appear the jquery message like it does on repeater

private void BindArtigos(int id)
{
    lstArtigos.DataSource = Requisicao.GetAll(id); 
    lstArtigos.DataBind();
}

Also there is no problem with Jquery plugin cause I had a repeater before writing the listview and was working properly

EDIT: Added the missing columns on table header, still shows nothing and no errors on console

Upvotes: 1

Views: 205

Answers (2)

Shubham
Shubham

Reputation: 351

 <td>
            <asp:Label ID="lblIdArtigo" Text="<%# Eval("IdArtigo") %>"></asp:Label></td>

replace this line with

 <td>
            <asp:Label ID="lblIdArtigo" Text='<%# Eval("IdArtigo") %>'></asp:Label></td>

and check if it shows data

check out this article

https://www.c-sharpcorner.com/UploadFile/9de7db/listview-control-in-Asp-Net/

Upvotes: 0

VDWWD
VDWWD

Reputation: 35544

The problem is that you have more cells in the body of the table that in the thead. They must be the same.

<thead class="thead-dark">
    <tr>
        <th style="width: 20px;">ID</th>
        <th style="width: 120px">Ref. Cliente</th>
        <th style="width: 100px">Ref. Interna</th>
        <th style="width: 100px">Nome</th>
        <th style="width: 100px">Logística</th>
        <th style="width: 100px">Estado</th>
        <th style="width: 10px;">Editar</th>
        <th style="width: 10px;">Validar</th>
        <th style="width: 10px;">Rejeitar</th>

        //add these
        <th># 1</th>
        <th># 2</th>
    </tr>
</thead>

Upvotes: 2

Related Questions