我正在考虑使用jQuery UI主题到我的ASP.NET网站的可行性。使用jQuery UI主题与ASP.Net控件
我发现了以下问题。我们如何纠正它们?
- 的Internet Explorer(IE 8) - >网格线是不是底部 可见(当不存在多页)
- 的Mozilla - >网格线不能用于报头
- 铬 - - >正常工作
它是否与asp.net控件兼容? 你可以请直接给我一些示例,显示正确使用这些jQuery类与asp.net控件(没有副作用)?
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.4.4.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.6/jquery-ui.js"></script>
<link href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.13/themes/sunny/jquery-ui.css"
rel="stylesheet" type="text/css" />
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
AllowPaging="True" PageSize="4">
<Columns>
<asp:BoundField DataField="ProductName" HeaderText="ProductName" ReadOnly="true"
SortExpression="ProductName" />
<asp:BoundField DataField="QuantityPerUnit" HeaderText="Qty" ReadOnly="true" SortExpression="QuantityPerUnit" />
<asp:BoundField DataField="CategoryName" HeaderText="Category" ReadOnly="true" SortExpression="CategoryName" />
</Columns>
</asp:GridView>
</div>
<br />
</form>
</body>
</html>
--Code背后
using System;
using System.Web.UI.WebControls;
using System.Data;
public partial class MyGridTest : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
DataTable dt = new DataTable();
dt.Columns.AddRange(new DataColumn[3] { new DataColumn("ProductName"), new DataColumn("QuantityPerUnit"), new DataColumn("CategoryName") });
dt.Rows.Add("Shirt", 200);
dt.Rows.Add("Football", 30);
dt.Rows.Add("Bat", 22.5);
//dt.Rows.Add("Football", 30);
//dt.Rows.Add("Bat", 22.5);
//dt.Rows.Add("Football", 30);
//dt.Rows.Add("Bat", 22.5);
GridView1.DataSource = dt;
GridView1.DataBind();
}
protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
GridView1.CssClass = "ui-widget-content";
if (GridView1.Rows.Count > 0)
{
//To render header in accessible format
GridView1.UseAccessibleHeader = true;
//Add the <thead> element
GridView1.HeaderRow.TableSection = TableRowSection.TableHeader;
GridView1.HeaderRow.CssClass = "ui-widget-header";
//Add the <tfoot> element
GridView1.FooterRow.TableSection = TableRowSection.TableFooter;
if (GridView1.TopPagerRow != null)
{
GridView1.TopPagerRow.TableSection = TableRowSection.TableHeader;
}
if (GridView1.BottomPagerRow != null)
{
GridView1.BottomPagerRow.TableSection = TableRowSection.TableFooter;
}
}
}
}
有人能够重现此问题吗? – Lijo 2012-02-08 04:10:34
您使用的是什么版本的.Net? – pete 2012-02-10 16:06:41
我正在使用.Net 4.0 – Lijo 2012-02-23 12:39:08