asp repeater and jquery.dataTable

本文关键字:dataTable jquery and repeater asp | 更新日期: 2023-09-27 18:31:12

也许有人可以帮助我。当页面被调用时,排序,分页等...未显示。我只在浏览器中收到此错误:TypeError: $ (...) DataTable is not a function.

JQuery 在Layout.master中具有约束力。

对不起,我的英语不好;我希望我已经提供了您需要的所有信息。

.asp:

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<asp:Repeater ID="Repeater1" runat="server">
        <HeaderTemplate>
            <div class="row">
                <div class="col-xs-12">
                    <div class="box">
                        <div class="box-body table-responsive no-padding">
                            <table id="nutzer" class="table table-hover table-condensed">
                                <thead>
                                    <tr>
                                        <th>Nr</th>
                                        <th>Kdnr</th>
                                        <th>Benutzername</th>
                                        <th>Name</th>
                                        <th>E-Mail</th>
                                        <th>Wo/Bereich</th>
                                        <th>Gesperrt</th>
                                        <th>Details</th>
                                    </tr>
                                </thead>
                                <tbody data-link="row" class="rowlink">
        </HeaderTemplate>
        <ItemTemplate>
            <tr>
                <td><%# Eval("Nr").ToString()%></td>
                <td><%# Eval("ADRNR").ToString() %></td>
                <td><%# Eval("Name").ToString()%></td>
                <td><%# Eval("Langname").ToString()%></td>
                <td><%# Eval("Email").ToString()%></td>
                <td><%# Eval("Wo").ToString()%></td>
                <td><span class="glyphicon glyphicon-<%# Convert.ToBoolean(Eval("gesperrt").ToString()) ? "ok" : "remove" %>" aria-hidden="true"></span></td>
                <td><a href="UserDetails.aspx?nr=<%# Eval("Nr").ToString()%>">Details</a></td>
            </tr>
        </ItemTemplate>
        <FooterTemplate>
            </tbody>
            </table>
            </div><!-- /.box-body -->
            </div><!-- /.box -->
            </div><!-- /.col-xs-12 -->
            </div><!-- /.row -->
        </FooterTemplate>
    </asp:Repeater>
<script src="plugins/datatables/jquery.dataTables.min.js" type="text/javascript"></script>
<script src="plugins/datatables/dataTables.bootstrap.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {
        $('#nutzer').dataTable({
            "bPaginate": true,
            "bLengthChange": false,
            "bFilter": false,
            "bSort": true,
            "bInfo": true,
            "bAutoWidth": false
        });
    });
</script>

asp repeater and jquery.dataTable

请参考下面的代码可以提供帮助。

<asp:Repeater ID="YourRepeaterId" runat="server">
                                            <HeaderTemplate>
                                                <table class="table table-striped table-bordered table-hover" id="TableId">
                                                    <thead>
                                                        <tr style="background-color:#1261A6 ;color:white">
                                                            <th>Column Name</th>
                                                            <th>Column Name</th>
                                                        </tr>
                                                    </thead>
                                            </HeaderTemplate>
                                            <ItemTemplate>
                                                <tr>
                                                    <td>
                                                        <asp:Label ID="lblTitle" runat="server" Text='<%# Eval("Column1") %>' />
                                                    </td>
                                                    <td>
                                                        <asp:Label ID="lblNoOfInvestigation" runat="server" Text='<%# Eval("Column2") %>' />
                                                    </td>
                                                </tr>
                                            </ItemTemplate>
                                        </asp:Repeater>

然后在下面添加 jquery 代码。

<script src="jquery.dataTables.min.js"></script>
<link href="jquery.dataTables.min.css" rel="stylesheet" />
<script type="text/javascript">
    $(document).ready(function () {
        $('#TableId').DataTable({
            "paging": true,
            fixedHeader: true,
            scrollY: '60vh',
            scrollX: true,
            scrollCollapse: true
        })
    });
</script>