Jquery数据表插件不能与gridview一起使用?

时间:2013-03-20 06:49:35

标签: c# asp.net jquery-plugins

我正在尝试将 jquerydatatable plugin 用于gridview.Data正在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;

1 个答案:

答案 0 :(得分:1)

原因是您在JavaScript中使用ASP .NET生成的ID。这不会起作用,因为ASP .NET会向其ID添加信息。为此,您需要告诉ASP .NET不要通过添加ClientIDMode="Static"属性来添加额外信息。

试试这个:

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