Jquery数据表插件不能与gridview一起工作

本文关键字：gridview 一起 工作 不能 数据表 插件 Jquery | 更新日期: 2023-09-27 18:04:53

我试图使用 jquerydatatable plugin 到gridview。数据被绑定在gridview中，但由于某些原因插件不工作

我找不到确切的原因，但我在控制台得到如下错误。问题是在我用过的脚本还是在编码部分?

TypeError: $(...).dataTable is not a function
Source File: http://localhost:3852/YouthPossibilities/jqDatatable.aspx

这是我的脚本，我使用

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.dataTables.js" ></script>
<script type="text/javascript" src="js/jquery.js" ></script>
<link href="css/demo_table.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" charset="utf-8">
    $(document).ready(function() {
        $('#gdView').dataTable();           
    })
</script>

下面是aspx代码

 <asp:GridView ID="gdView" runat="server" AutoGenerateColumns="False" OnPreRender="gdView_PreRender">
        <Columns>
            <asp:TemplateField HeaderText="FirstName">
                <ItemTemplate >
                    <asp:Label ID="lblFstName" runat="server" Text='<%# Bind("FirstName") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="LastName">
                <ItemTemplate>
                    <asp:Label ID="lblLstName" runat="server" Text='<%# Bind("LastName") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Organization">
                <ItemTemplate>
                    <asp:Label ID="lblOrg" runat="server" Text='<%# Bind("Organization") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>            
    </asp:GridView>
下面是我绑定gridview的c#代码 
    List<gdViewBAL> lstgdviewBAL = new List<gdViewBAL>();
    gdViewDAL clsgdViewDAL = new gdViewDAL();
    DataTable dt = clsgdViewDAL.GetData();
    if (dt.Rows.Count > 0)
    {
        foreach (DataRow dRow in dt.Rows)
        {
            gdViewBAL clsgdviewBAL = new gdViewBAL();
            clsgdviewBAL.Cellphone = dRow["CellPhone"].ToString();
            clsgdviewBAL.Email = dRow["Email"].ToString();
            clsgdviewBAL.Firstname = dRow["FirstName"].ToString();
            clsgdviewBAL.Lastname = dRow["LastName"].ToString();
            clsgdviewBAL.Organization = dRow["Organization"].ToString();
            clsgdviewBAL.State1 = dRow["State1"].ToString();
            clsgdviewBAL.Zip1 = dRow["Zip1"].ToString();
            lstgdviewBAL.Add(clsgdviewBAL);
        }
        gdView.DataSource = lstgdviewBAL;
        gdView.DataBind();
        gdView.UseAccessibleHeader = true;
        gdView.HeaderRow.TableSection = TableRowSection.TableHeader;
        gdView.FooterRow.TableSection = TableRowSection.TableFooter;

Jquery数据表插件不能与gridview一起工作

原因是您在JavaScript中使用的是asp.net生成的ID。这将不起作用，因为asp.net将信息添加到其id中。为了做到这一点，您需要告诉asp.net不要通过添加ClientIDMode="Static"属性来添加额外的信息。

试试这个:

<asp:GridView ID="gdView" runat="server" AutoGenerateColumns="False" OnPreRender="gdView_PreRender" ClientIDMode="Static">

相关文章：