【发布时间】：2016-12-08 12:43:14
【问题描述】：
当我在普通的 ASP.Net 页面中使用 jQuery DataTable 时，它可以正常工作。但是，当我在母版页中使用相同的代码时，它会给我一个错误：
未捕获的类型错误：$(...).prepend(...).dataTableExt 不是函数
我是否正在编写两个代码：
工作代码：
.aspx 页面代码
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="JqueryDataTables.aspx.cs" Inherits="Portal.WebApp.Login.JqueryDataTables" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="css/bootstrap.min.css" rel="stylesheet" />
<script src="js/jquery-1.12.3.js"></script>
<script src="js/jquery.dataTables.min.js"></script>
<link href="css/dataTables.jqueryui.min.css" rel="stylesheet" />
<link href="css/jquery-ui.css" rel="stylesheet" />
<script type="text/javascript">
$(function () {
debugger;
$("#DataGridView").prepend($("<thead></thead>").append($(this).find("tr:first"))).dataTable();
$('#DataGridView').dataTable();
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="DataGridView" Font-Names="Calibri" Font-Size="11pt" AutoGenerateColumns="false" OnPreRender="DataGridView_PreRender" runat="server"></asp:GridView>
</div>
</form>
</body>
</html>
.cs页面代码
using System;
using System.Data;
using System.Web.UI.WebControls;
namespace Citizen.WebApp.Login
{
public partial class JqueryDataTables : System.Web.UI.Page
{
RegistrationBLL m_RegistrationBLL = new RegistrationBLL();
protected void Page_Load(object sender, EventArgs e)
{
DataTable dt = null;
dt = m_RegistrationBLL.GetList();
DataGridView.DataSource = dt;
int i;
for (i = 0; i < dt.Columns.Count; i++)
{
BoundField test = new BoundField();
test.DataField = dt.Columns[i].ToString();
test.HeaderText = dt.Columns[i].ToString();
DataGridView.Columns.Add(test);
test = null;
}
DataGridView.DataBind();
}
protected void DataGridView_PreRender(object sender, EventArgs e)
{
if (DataGridView.Rows.Count > 0)
{
DataGridView.UseAccessibleHeader = true;
DataGridView.HeaderRow.TableSection = TableRowSection.TableHeader;
DataGridView.FooterRow.TableSection = TableRowSection.TableFooter;
}
}
}
}
不工作的代码：
.aspx 页面代码
<%@ Page Title="" Language="C#" MasterPageFile="~/portal/master/Home.Master" AutoEventWireup="true" CodeBehind="MasterDataTable.aspx.cs" Inherits="Portal.WebApp.Login.MasterDataTable" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<script src="js/jquery-1.12.3.js"></script>
<script src="js/jquery.dataTables.min.js"></script>
<link href="css/bootstrap.min.css" rel="stylesheet" />
<link href="css/dataTables.jqueryui.min.css" rel="stylesheet" />
<link href="css/jquery-ui.css" rel="stylesheet" />
<script type="text/javascript" lang="javascript">
$(function () {
debugger;
$("#DataGridView").prepend($("<thead></thead>").append($(this).find("tr:first"))).dataTableExt();
$('#DataGridView').dataTableExt();
});
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="cphbody" runat="Server">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1">
<title></title>
</head>
<body>
<div>
<asp:GridView ID="DataGridView" Font-Names="Calibri" Font-Size="11pt" AutoGenerateColumns="false" OnPreRender="DataGridView_PreRender" runat="server"></asp:GridView>
</div>
</body>
</html>
</asp:Content>
.cs页面代码
using System;
using System.Data;
using System.Web.UI.WebControls;
namespace Citizen.WebApp.Login
{
public partial class MasterDataTable : System.Web.UI.Page
{
RegistrationBLL m_RegistrationBLL = new RegistrationBLL();
protected void Page_Load(object sender, EventArgs e)
{
DataTable dt = null;
dt = m_RegistrationBLL.GetList();
DataGridView.DataSource = dt;
int i;
for (i = 0; i < dt.Columns.Count; i++)
{
BoundField test = new BoundField();
test.DataField = dt.Columns[i].ToString();
test.HeaderText = dt.Columns[i].ToString();
DataGridView.Columns.Add(test);
test = null;
}
DataGridView.DataBind();
}
protected void DataGridView_PreRender(object sender, EventArgs e)
{
if (DataGridView.Rows.Count > 0)
{
DataGridView.UseAccessibleHeader = true;
DataGridView.HeaderRow.TableSection = TableRowSection.TableHeader;
DataGridView.FooterRow.TableSection = TableRowSection.TableFooter;
}
}
}
}
【问题讨论】：
-
最好在 MasterPages 中加载库文件。为什么在子页面中使用
html和body标签？ -
确保路径与新项目相关。
-
我已经完成了所有可能的解决方案，但没有运气。我已经用空白母版页检查了相同的内容并得到了相同的响应，但没有运气......我相信它们会限制母版页加载和初始化 asp.net 母版页中的 jquery 数据表。
-
@ Satpal - 我已经完成了所有可能的解决方案，但仍在 asp.net 母版页中 Jquery DataTable 没有完全初始化。请建议或帮助，因为我需要尽快关闭此。 ☹
-
datatables.net/manual/api notes DataTable 的大写 D 与您的代码不同，我还将修复 DataGrid 的 ID，因为 HTML 可能需要额外的字符才能使其工作正确地作为第二个想法。
标签： jquery asp.net master-pages