我需要凍結列0,1同時我想要的行(不是頭,隱藏的頭)0,1,2凍結以及當用戶滾動上下滾動,也滾動從左到右這些列和行將靜態在那裏,我嘗試了一些jQuery代碼,但它沒有工作,我發現這個CSS例子在一個堆棧溢出問題,我把它用於我的項目。到目前爲止,我只和列一起工作,以儘快完成這個任務,但是我還需要像鎖定行之前所說的那樣。Gridview ASP.NET鎖第一列和第一行
我有一個GridView ASP.NET C#內部的HTML表格,在事件「加載頁面」的網格獲取數據表信息。這個Datable從SQL數據庫獲取信息。
我在網格上應用CSS時,事件觸發,所有這些工作正常!
爲了給你一個想法網格的樣子,你在這裏有一個例子:
你看不到的水平滾動條,因爲歲月的量用戶選擇,但是這可以根據他的選擇而改變。
這是我最近使用的CSS:
.pinned
{
position:fixed;
background-color: #FFFFFF;
z-index: 100;
}
.scrolled
{
position: relative;
left: 150px;
overflow: hidden;
white-space: nowrap;
min-width: 50px;
}
.col1
{
left: 0px;
width: 50px;
}
.col2
{
left: 50px;
width: 100px;
}
HTML:
<div style="overflow:scroll; height: 400px; width: 911px; margin:auto;">
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="true" GridLines="Vertical" OnRowCreated="COl" OnRowDataBound="ROWCSS" ShowHeader="false">
</asp:GridView>
</div>
此C#代碼,當rowcreated事件觸發:然後我COLSPAN頭(第一3行-0 ,1,2)
當的RowDataBound火災:然後我應用CSS字體和背景顏色:
protected void ROWCSS(object sender, GridViewRowEventArgs e)
{
int i = e.Row.Cells.Count;
int index = e.Row.RowIndex;
if (e.Row.RowType == DataControlRowType.DataRow)
{
//THIS IS THE FOR, THAT LOCKS THE COLUMN 0 and 1 ************
for (int j = 0; j <= (i - 1); j++)
{
if (j == 0)
{
e.Row.Cells[j].CssClass = "pinned col1";
}
else if (j == 1)
{
e.Row.Cells[j].CssClass = "pinned col2";
}
else
{
e.Row.Cells[j].CssClass = "scrolled";
}
}
//********************************
if (index == 3 || index == 32 || index == 46 || index == 50)
{
for (int j = 0; j <= (i - 1); j++)
{
//Si la columna es la 0 o la 1, entonces aplicar formato izquierdo
if (j == 0 || j == 1)
{
e.Row.Cells[j].CssClass = "naranjaCSSLEFT";
}
//En caso contrario, formato derecho
else
{
e.Row.Cells[j].CssClass = "naranjaCSSRIGHT";
}
}
}
else if (index == 4 || index == 15 || index == 29 || index == 33 || index == 41)
{
for (int j = 0; j <= (i - 1); j++)
{
//Si la columna es la 0 o la 1, entonces aplicar formato izquierdo
if (j == 0 || j == 1)
{
e.Row.Cells[j].CssClass = "azulCSSLEFT";
}
//En caso contrario, formato derecho
else
{
e.Row.Cells[j].CssClass = "azulCSSRIGHT";
}
}
}
else if (!(index == 0 || index == 1 || index == 2))
{
for (int j = 0; j <= (i - 1); j++)
{
//Si la columna es la 0 o la 1, entonces aplicar formato izquierdo
if (j == 0 || j == 1)
{
e.Row.Cells[j].CssClass = "negroCSSLEFT";
}
//En caso contrario, formato derecho
else
{
e.Row.Cells[j].CssClass = "negroCSSRIGHT";
}
}
}
}
}
最後,這是一些我用彩色字體和背景(不知道這是需要提供)的CSS:
.naranjaCSSLEFT
{
font-weight:bold;
color:#C65911;
font-size: 13px;
text-align:left;
font-family:tahoma;
}
.naranjaCSSRIGHT
{
font-weight:bold;
color:#C65911;
font-size: 13px;
text-align:right;
font-family:tahoma;
}
.azulCSSLEFT
{
font-weight:bold;
color:#2F75B5;
font-size: 13px;
text-align:left;
font-family:tahoma;
}
.azulCSSRIGHT
{
font-weight:bold;
color:#2F75B5;
font-size: 13px;
text-align:right;
font-family:tahoma;
}
.negroCSSLEFT
{
font-weight:normal;
color:#000000;
font-size: 13px;
text-align:left;
font-family:tahoma;
}
.negroCSSRIGHT
{
font-weight:normal ;
color:#000000;
font-size: 13px;
text-align:right;
font-family:tahoma;
}
.FILACSS
{
font-weight:bold ;
color:#FFFFFF;
font-size: 13px;
text-align:center;
font-family:tahoma;
background:#2F75B5;
border:hidden;
}
如果你想知道我是什麼應用此之後,得到的是這樣的:
它看起來:搞砸了!第3排......不知道發生了什麼事。該colspan應用於不同的事件。
,如果你想知道的合併單元格Rowcreated事件是什麼,是這樣的:
protected void COl(object sender, GridViewRowEventArgs e)
{
int index = e.Row.RowIndex;
int i = e.Row.Cells.Count;
if (i == 4)
{
if (index == 0)
{
for (int j = 2; j <= (i - 1); j++)
{
//e.Row.Cells[j].CssClass = "GVFixedHeader";
e.Row.Cells[j].CssClass = "FILACSS";
}
// e.Row.Cells[2].Text = "ACUMULADO DE ENERO - " + NomMes;
e.Row.Cells[2].ColumnSpan = 2;
e.Row.Cells.RemoveAt(3);
}
if (index == 1)
{
for (int j = 2; j <= (i - 1); j++)
{
e.Row.Cells[j].CssClass = "FILACSS";
}
}
if (index == 2)
{
for (int j = 2; j <= (i - 1); j++)
{
e.Row.Cells[j].CssClass = "FILACSS";
}
}
}
if (i == 8)
{
if (index == 0)
{
for (int j = 2; j <= (i - 1); j++)
{
//e.Row.Cells[j].CssClass = "FILACSS";
e.Row.Cells[j].CssClass = "FILACSS";
}
//*******************************
//e.Row.Cells[0].Text = "ACUMULADO DE ENERO - " + NomMes;
e.Row.Cells[2].ColumnSpan = 6;
for (int b = 7; b >= 3; b--)
{
e.Row.Cells.RemoveAt(b);
}
}
if (index == 1)
{
for (int j = 2; j <= (i - 1); j++)
{
//e.Row.Cells[j].CssClass = "FILACSS";
e.Row.Cells[j].CssClass = "FILACSS";
}
//******************************
for (int b = 2; b <= 6; b++)
{
e.Row.Cells[b].ColumnSpan = 2;
b++;
}
for (int b = 7; b >= 3; b--)
{
e.Row.Cells.RemoveAt(b);
b--;
}
}
if (index == 2)
{
for (int j = 2; j <= (i - 1); j++)
{
//e.Row.Cells[j].CssClass = "FILACSS";
e.Row.Cells[j].CssClass = "FILACSS";
}
}
}
if (i == 10)
{
if (index == 0)
{
for (int j = 2; j <= (i - 1); j++)
{
e.Row.Cells[j].CssClass = "FILACSS";
}
//*******************************
//e.Row.Cells[2].Text = "ACUMULADO DE ENERO - " + NomMes;
e.Row.Cells[2].ColumnSpan = 8;
for (int b = 9; b >= 3; b--)
{
e.Row.Cells.RemoveAt(b);
}
}
if (index == 1)
{
for (int j = 2; j <= (i - 1); j++)
{
e.Row.Cells[j].CssClass = "FILACSS";
}
//******************************
for (int b = 2; b <= 8; b++)
{
e.Row.Cells[b].ColumnSpan = 2;
b++;
}
for (int b = 9; b >= 3; b--)
{
e.Row.Cells.RemoveAt(b);
b--;
}
}
if (index == 2)
{
for (int j = 2; j <= (i - 1); j++)
{
e.Row.Cells[j].CssClass = "FILACSS";
}
}
}
if (i == 12)
{
if (index == 0)
{
for (int j = 2; j <= (i - 1); j++)
{
e.Row.Cells[j].CssClass = "FILACSS";
}
//*******************************
//e.Row.Cells[2].Text = "ACUMULADO DE ENERO - " + NomMes;
e.Row.Cells[2].ColumnSpan = 10;
for (int b = 11; b >= 3; b--)
{
e.Row.Cells.RemoveAt(b);
}
}
if (index == 1)
{
for (int j = 2; j <= (i - 1); j++)
{
e.Row.Cells[j].CssClass = "FILACSS";
}
//******************************
for (int b = 2; b <= 10; b++)
{
e.Row.Cells[b].ColumnSpan = 2;
b++;
}
for (int b = 11; b >= 3; b--)
{
e.Row.Cells.RemoveAt(b);
b--;
}
}
if (index == 2)
{
for (int j = 2; j <= (i - 1); j++)
{
e.Row.Cells[j].CssClass = "FILACSS";
}
}
}
}
列不漸凍呢。