ASP.NET MVC+EF在服務端分頁使用jqGrid以及jquery Datatables的注意事項

當前位置：首頁 > 范文|應用文 > IT技術專欄 > 網絡編程

來源：易賢網閱讀：3870 次日期：2016-08-08 13:59:20

溫馨提示：易賢網小編為您整理了“ASP.NET MVC+EF在服務端分頁使用jqGrid以及jquery Datatables的注意事項”,方便廣大網友查閱！

本文實例講述了asp.net實現固定GridView標題欄的方法。分享給大家供大家參考，具體如下：

<%@ Page Language="C#" %>

<%@ Import Namespace="System.Data" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

protected void Page_Load(object sender, EventArgs e)

{

DataTable t = new DataTable();

t.Columns.Add("序號", typeof(int));

t.Columns.Add("材料", typeof(string));

t.Columns.Add("單價", typeof(decimal));

for (int i = 1; i <= 10; i++)

t.Columns.Add("庫存" + i, typeof(int));

Random rnd = new Random();

for (int i = 0; i < 80; i++)

{

DataRow row = t.NewRow();

row["序號"] = i + 1;

row["材料"] = Guid.NewGuid().ToString().Substring(0, 13).ToUpper();

row["單價"] = rnd.NextDouble() * 100;

for (int j = 1; j <= 10; j++)

row["庫存" + j] = rnd.Next(10000);

t.Rows.Add(row);

}

GridView1.AutoGenerateColumns = false;

foreach (DataColumn c in t.Columns)

{

BoundField bf = new BoundField();

bf.DataField = c.ColumnName;

bf.HeaderText = c.ColumnName;

if (c.DataType == typeof(decimal))

bf.DataFormatString = "{0:#,0.00}";

else if (c.DataType == typeof(int))

bf.DataFormatString = "{0:#,0}";

bf.ItemStyle.HorizontalAlign =

(!string.IsNullOrEmpty(bf.DataFormatString)) ?

HorizontalAlign.Right : HorizontalAlign.Center;

GridView1.Columns.Add(bf);

}

GridView1.DataSource = t;

GridView1.DataBind();

}

</script>

.altRow { background-color: #ddddff; }

</style>

$(function() {

$("#GridView1").toSuperTable({ width: "640px", height: "480px", fixedCols: 2 })

.find("tr:even").addClass("altRow");

});

</script>

</head>

<body>

<asp:GridView ID="GridView1" runat="server" Font-Size="9pt" EnableViewState="false">

</asp:GridView>

</form>

</body>

</html>

----------------------------------------------------

// Super Tables Plugin for jQuery - MIT Style License

// A wrapper for Matt Murphy's Super Tables http://www.matts411.com/post/super_tables/

// Contributors:

////// TO CALL:

// $("...").toSuperTable(options)

////// OPTIONS: (order does not matter )

// cssSkin : string ( eg. "sDefault", "sSky", "sOrange", "sDark" )

// headerRows : integer ( default is 1 )

// fixedCols : integer ( default is 0 )

// colWidths : integer array ( use -1 for auto sizing )

// onStart : function ( any this.variableNameHere variables you create here can be used later ( eg. onFinish function ) )

// onFinish : function ( all this.variableNameHere variables created in this script can be used in this function )

// margin, padding, width, height, overflow...: Styles for "fakeContainer"

////// Example:

// $("#GridView1").toSuperTable(

// { width: "640px", height: "480px", fixedCols: 2,

// onFinish: function() { alert('Done!'); } })

// jquery.superTable.js

(function($) {

$.fn.extend(

{

toSuperTable: function(options) {

var setting = $.extend(

{

width: "640px", height: "320px",

margin: "10px", padding: "0px",

overflow: "hidden", colWidths: undefined,

fixedCols: 0, headerRows: 1,

onStart: function() { },

onFinish: function() { },

cssSkin: "sSky"

}, options);

return this.each(function() {

var q = $(this);

var id = q.attr("id");

q.removeAttr("style").wrap("<div id='" + id + "_box'></div>");

var nonCssProps = ["fixedCols", "headerRows", "onStart", "onFinish", "cssSkin", "colWidths"];

var container = $("#" + id + "_box");

for (var p in setting) {

if ($.inArray(p, nonCssProps) == -1) {

container.css(p, setting[p]);

delete setting[p];

}

var mySt = new superTable(id, setting);

});

}

});

})(jQuery);

------------------------------------------------

// Super Tables v0.30 - MIT Style License

// Contributors:

// Joe Gallo

////// TO CALL:

// new superTable([string] tableId, [object] options);

////// OPTIONS: (order does not matter )

// cssSkin : string ( eg. "sDefault", "sSky", "sOrange", "sDark" )

// headerRows : integer ( default is 1 )

// fixedCols : integer ( default is 0 )

// colWidths : integer array ( use -1 for auto sizing )

// onStart : function ( any this.variableNameHere variables you create here can be used later ( eg. onFinish function ) )

// onFinish : function ( all this.variableNameHere variables created in this script can be used in this function )

////// EXAMPLES:

// var myST = new superTable("myTableId");

// var myST = new superTable("myTableId", {

// cssSkin : "sDefault",

// headerRows : 1,

// fixedCols : 2,

// colWidths : [100, 230, 220, -1, 120, -1, -1, 120],

// onStart : function () {

// this.start = new Date();

// },

// onFinish : function () {

// alert("Finished... " + ((new Date()) - this.start) + "ms.");

// }

// });

////// ISSUES / NOTES:

// 1. No quirksmode support (officially, but still should work)

// 2. Element id's may be duplicated when fixedCols > 0, causing getElementById() issues

// 3. Safari will render the header row incorrectly if the fixed header row count is 1 and there is a colspan > 1 in one

// or more of the cells (fix available)

////////////superTables.js///////////

var superTable = function (tableId, options) {

/////* Initialize */

options = options || {};

this.cssSkin = options.cssSkin || "";

this.headerRows = parseInt(options.headerRows || "1");

this.fixedCols = parseInt(options.fixedCols || "0");

this.colWidths = options.colWidths || [];

this.initFunc = options.onStart || null;

this.callbackFunc = options.onFinish || null;

this.initFunc && this.initFunc();

/////* Create the framework dom */

this.sBase = document.createElement("DIV");

this.sFHeader = this.sBase.cloneNode(false);

this.sHeader = this.sBase.cloneNode(false);

this.sHeaderInner = this.sBase.cloneNode(false);

this.sFData = this.sBase.cloneNode(false);

this.sFDataInner = this.sBase.cloneNode(false);

this.sData = this.sBase.cloneNode(false);

this.sColGroup = document.createElement("COLGROUP");

this.sDataTable = document.getElementById(tableId);

this.sDataTable.style.margin = "0px"; /* Otherwise looks bad */

if (this.cssSkin !== "") {

this.sDataTable.className += " " + this.cssSkin;

}

if (this.sDataTable.getElementsByTagName("COLGROUP").length > 0) {

this.sDataTable.removeChild(this.sDataTable.getElementsByTagName("COLGROUP")[0]); /* Making our own */

}

this.sParent = this.sDataTable.parentNode;

this.sParentHeight = this.sParent.offsetHeight;

this.sParentWidth = this.sParent.offsetWidth;

/////* Attach the required classNames */

this.sBase.className = "sBase";

this.sFHeader.className = "sFHeader";

this.sHeader.className = "sHeader";

this.sHeaderInner.className = "sHeaderInner";

this.sFData.className = "sFData";

this.sFDataInner.className = "sFDataInner";

this.sData.className = "sData";

/////* Clone parts of the data table for the new header table */

var alpha, beta, touched, clean, cleanRow, i, j, k, m, n, p;

this.sHeaderTable = this.sDataTable.cloneNode(false);

if (this.sDataTable.tHead) {

alpha = this.sDataTable.tHead;

this.sHeaderTable.appendChild(alpha.cloneNode(false));

beta = this.sHeaderTable.tHead;

} else {

alpha = this.sDataTable.tBodies[0];

this.sHeaderTable.appendChild(alpha.cloneNode(false));

beta = this.sHeaderTable.tBodies[0];

}

alpha = alpha.rows;

for (i=0; i<this.headerRows; i++) {

beta.appendChild(alpha[i].cloneNode(true));

}

this.sHeaderInner.appendChild(this.sHeaderTable);

if (this.fixedCols > 0) {

this.sFHeaderTable = this.sHeaderTable.cloneNode(true);

this.sFHeader.appendChild(this.sFHeaderTable);

this.sFDataTable = this.sDataTable.cloneNode(true);

this.sFDataInner.appendChild(this.sFDataTable);

}

/////* Set up the colGroup */

alpha = this.sDataTable.tBodies[0].rows;

for (i=0, j=alpha.length; i<j; i++) {

clean = true;

for (k=0, m=alpha[i].cells.length; k<m; k++) {

if (alpha[i].cells[k].colSpan !== 1 || alpha[i].cells[k].rowSpan !== 1) {

i += alpha[i].cells[k].rowSpan - 1;

clean = false;

break;

}

if (clean === true) break; /* A row with no cells of colSpan > 1 || rowSpan > 1 has been found */

}

cleanRow = (clean === true) ? i : 0; /* Use this row index to calculate the column widths */

for (i=0, j=alpha[cleanRow].cells.length; i<j; i++) {

if (i === this.colWidths.length || this.colWidths[i] === -1) {

this.colWidths[i] = alpha[cleanRow].cells[i].offsetWidth;

}

for (i=0, j=this.colWidths.length; i<j; i++) {

this.sColGroup.appendChild(document.createElement("COL"));

this.sColGroup.lastChild.setAttribute("width", this.colWidths[i]);

}

this.sDataTable.insertBefore(this.sColGroup.cloneNode(true), this.sDataTable.firstChild);

this.sHeaderTable.insertBefore(this.sColGroup.cloneNode(true), this.sHeaderTable.firstChild);

if (this.fixedCols > 0) {

this.sFDataTable.insertBefore(this.sColGroup.cloneNode(true), this.sFDataTable.firstChild);

this.sFHeaderTable.insertBefore(this.sColGroup.cloneNode(true), this.sFHeaderTable.firstChild);

}

/////* Style the tables individually if applicable */

if (this.cssSkin !== "") {

this.sDataTable.className += " " + this.cssSkin + "-Main";

this.sHeaderTable.className += " " + this.cssSkin + "-Headers";

if (this.fixedCols > 0) {

this.sFDataTable.className += " " + this.cssSkin + "-Fixed";

this.sFHeaderTable.className += " " + this.cssSkin + "-FixedHeaders";

}

/////* Throw everything into sBase */

if (this.fixedCols > 0) {

this.sBase.appendChild(this.sFHeader);

}

this.sHeader.appendChild(this.sHeaderInner);

this.sBase.appendChild(this.sHeader);

if (this.fixedCols > 0) {

this.sFData.appendChild(this.sFDataInner);

this.sBase.appendChild(this.sFData);

}

this.sBase.appendChild(this.sData);

this.sParent.insertBefore(this.sBase, this.sDataTable);

this.sData.appendChild(this.sDataTable);

/////* Align the tables */

var sDataStyles, sDataTableStyles;

this.sHeaderHeight = this.sDataTable.tBodies[0].rows[(this.sDataTable.tHead) ? 0 : this.headerRows].offsetTop;

sDataTableStyles = "margin-top: " + (this.sHeaderHeight * -1) + "px;";

sDataStyles = "margin-top: " + this.sHeaderHeight + "px;";

sDataStyles += "height: " + (this.sParentHeight - this.sHeaderHeight) + "px;";

if (this.fixedCols > 0) {

/* A collapsed table's cell's offsetLeft is calculated differently (w/ or w/out border included) across broswers - adjust: */

this.sFHeaderWidth = this.sDataTable.tBodies[0].rows[cleanRow].cells[this.fixedCols].offsetLeft;

if (window.getComputedStyle) {

alpha = document.defaultView;

beta = this.sDataTable.tBodies[0].rows[0].cells[0];

if (navigator.taintEnabled) { /* If not Safari */

this.sFHeaderWidth += Math.ceil(parseInt(alpha.getComputedStyle(beta, null).getPropertyValue("border-right-width")) / 2);

} else {

this.sFHeaderWidth += parseInt(alpha.getComputedStyle(beta, null).getPropertyValue("border-right-width"));

}

} else if (/*@cc_on!@*/0) { /* Internet Explorer */

alpha = this.sDataTable.tBodies[0].rows[0].cells[0];

beta = [alpha.currentStyle["borderRightWidth"], alpha.currentStyle["borderLeftWidth"]];

if(/px/i.test(beta[0]) && /px/i.test(beta[1])) {

beta = [parseInt(beta[0]), parseInt(beta[1])].sort();

this.sFHeaderWidth += Math.ceil(parseInt(beta[1]) / 2);

}

/* Opera 9.5 issue - a sizeable data table may cause the document scrollbars to appear without this: */

if (window.opera) {

this.sFData.style.height = this.sParentHeight + "px";

}

this.sFHeader.style.width = this.sFHeaderWidth + "px";

sDataTableStyles += "margin-left: " + (this.sFHeaderWidth * -1) + "px;";

sDataStyles += "margin-left: " + this.sFHeaderWidth + "px;";

sDataStyles += "width: " + (this.sParentWidth - this.sFHeaderWidth) + "px;";

} else {

sDataStyles += "width: " + this.sParentWidth + "px;";

}

this.sData.style.cssText = sDataStyles;

this.sDataTable.style.cssText = sDataTableStyles;

/////* Set up table scrolling and IE's onunload event for garbage collection */

(function (st) {

if (st.fixedCols > 0) {

st.sData.onscroll = function () {

st.sHeaderInner.style.right = st.sData.scrollLeft + "px";

st.sFDataInner.style.top = (st.sData.scrollTop * -1) + "px";

};

} else {

st.sData.onscroll = function () {

st.sHeaderInner.style.right = st.sData.scrollLeft + "px";

};

}

if (/*@cc_on!@*/0) { /* Internet Explorer */

window.attachEvent("onunload", function () {

st.sData.onscroll = null;

st = null;

});

}

})(this);

this.callbackFunc && this.callbackFunc();

};

--------------------------------------------------

// Super Tables v0.30 - MIT Style License

// Contributors:

// Joe Gallo

////////////superTables.css////////////////

.sBase {

position: relative;

width: 100%;

height: 100%;

overflow: hidden;

}

/* HEADERS */

.sHeader {

position: absolute;

z-index: 3;

background-color: #ffffff;

}

.sHeaderInner {

position: relative;

}

.sHeaderInner table {

border-spacing: 0px 0px !important;

border-collapse: collapse !important;

width: 1px !important;

table-layout: fixed !important;

background-color: #ffffff; /* Here b/c of Opera 9.25 :( */

}

/* HEADERS - FIXED */

.sFHeader {

position: absolute;

z-index: 4;

overflow: hidden;

}

.sFHeader table {

border-spacing: 0px 0px !important;

border-collapse: collapse !important;

width: 1px !important;

table-layout: fixed !important;

background-color: #ffffff; /* Here b/c of Opera 9.25 :( */

}

/* BODY */

.sData {

position: absolute;

z-index: 2;

overflow: auto;

background-color: #ffffff;

}

.sData table {

border-spacing: 0px 0px !important;

border-collapse: collapse !important;

width: 1px !important;

table-layout: fixed !important;

}

/* BODY - FIXED */

.sFData {

position: absolute;

z-index: 1;

background-color: #ffffff;

}

.sFDataInner {

position: relative;

}

.sFData table {

border-spacing: 0px 0px !important;

border-collapse: collapse !important;

width: 1px !important;

table-layout: fixed !important;

}

// Super Tables - Skin Classes

// Remove if not needed

/* sDefault */

.sDefault {

margin: 0px;

padding: 0px;

border: none;

font-family: Verdana, Arial, sans serif;

font-size: 0.8em;

}

.sDefault th, .sDefault td {

border: 1px solid #cccccc;

padding: 3px 6px 3px 4px;

white-space: nowrap;

}

.sDefault th {

background-color: #e5e5e5;

border-color: #c5c5c5;

}

.sDefault-Fixed {

background-color: #eeeeee;

border-color: #c5c5c5;

}

/* sSky */

.sSky {

margin: 0px;

padding: 0px;

border: none;

font-family: Verdana, Arial, sans serif;

font-size: 0.8em;

}

.sSky th, .sSky td {

border: 1px solid #9eb6ce;

padding: 3px 6px 3px 4px;

white-space: nowrap;

}

.sSky th {

background-color: #CFDCEE;

}

.sSky-Fixed {

background-color: #e4ecf7;

}

/* sOrange */

.sOrange {

margin: 0px;

padding: 0px;

border: none;

font-family: Verdana, Arial, sans serif;

font-size: 0.8em;

}

.sOrange th, .sOrange td {

border: 1px solid #cebb9e;

padding: 3px 6px 3px 4px;

white-space: nowrap;

}

.sOrange th {

background-color: #ECD8C7;

}

.sOrange-Fixed {

background-color: #f7ede4;

}

/* sDark */

.sDark {

margin: 0px;

padding: 0px;

border: none;

font-family: Verdana, Arial, sans serif;

font-size: 0.8em;

color: #ffffff;

}

.sDark th, .sDark td {

border: 1px solid #555555;

padding: 3px 6px 3px 4px;

white-space: nowrap;

}

.sDark th {

background-color: #000000;

}

.sDark-Fixed {

background-color: #222222;

}

.sDark-Main {

background-color: #333333;

}

希望本文所述對大家asp.net程序設計有所幫助。

上一篇：實例解析Java中的synchronized關鍵字與線程安全問題

下一篇：asp.net實現DropDownList,TreeView,ListBox的無限極分類目錄樹

易賢網手機網站地址：ASP.NET MVC+EF在服務端分頁使用jqGrid以及jquery Datatables的注意事項

由于各方面情況的不斷調整與變化，易賢網提供的所有考試信息和咨詢回復僅供參考，敬請考生以權威部門公布的正式信息和咨詢?yōu)闇剩?/div>

相關閱讀網絡編程

Shell中如何刪除文本比較長的行的實現方法10月30日

vue.js語法及常用指令10月30日

python 讀寫中文json的實例詳解10月30日

Objective-C Json 實例詳解10月30日

bootstrap table sum總數量統計實現方法10月30日

python生成二維碼的實例詳解10月30日

Python批量更改文件名的實現方法10月30日

解決出現Incorrect integer value的問題10月30日

jQuery實現切換隱藏與顯示同時切換圖標功能10月30日

docker python api 安裝配置的詳解10月30日

javascript按鈕禁用和啟用的效果實例代碼10月30日

vue.js todolist實現代碼10月30日

vue.js 父向子組件傳參的實例代碼10月30日

apache 開啟重定向 rewrite的實現方法10月30日

Vue.js劃分組件的方法10月30日

python logging日志模塊的詳解10月30日

vue中的scope使用詳解10月30日

docker cgroup 資源監(jiān)控的詳解10月30日

使用Android Studio 開發(fā)自己的SDK教程10月23日

linux系統下MongoDB單節(jié)點安裝教程10月23日

易賢網移動網站

2026上岸·考公考編培訓報班

報班類型
姓名
手機號
驗證碼

茄子在线看片免费人成视频,午夜福利精品a在线观看,国产高清自产拍在线观看,久久综合久久狠狠综合