asp.net GridView 中增加記錄的方法
更新時(shí)間:2009年03月23日 03:51:01 作者:
在 ASP.NET 2.0 中,GridView 支持修改/刪除記錄,但卻不支持新增記錄的功能(個(gè)人感覺(jué)是 GridVew 的一大缺憾,估計(jì)在下一版本中會(huì)加入此功能)
大多數(shù)人建議用 FormView 來(lái)完成增加記錄的功能,但是 FormView 和 GridView 不是同一個(gè)表格,所以無(wú)法在同一個(gè)頁(yè)面的同一個(gè)表格中顯示。如果故意將 FormView 或自己的一堆于用新增功能的控件使用普通的表格組裝起來(lái),那么會(huì)碰到一個(gè)很麻煩的問(wèn)題,即兩個(gè)表格的列寬如何協(xié)調(diào)一致,大多數(shù)情況下,大家在做表格的時(shí)候,表格中各列的寬度都是自動(dòng)調(diào)整的,所以強(qiáng)行指定寬度在很多情況下并不適用。
通過(guò)實(shí)踐,想出了一種辦法,主要步驟如下所示:
1) 在 GridView 的 EmptyDataView 中,放置一個(gè)普通的Html Table,以便在GridView綁定的數(shù)據(jù)源中無(wú)數(shù)據(jù)時(shí)依舊顯示表頭(如果數(shù)據(jù)源為返回的數(shù)據(jù)行數(shù)為0,GridView默認(rèn)是不顯示表頭的),假設(shè) ID 為 tbHeader,它的作用是下面用于新增功能的 tbForm 的各列控件提供說(shuō)明(充當(dāng)表頭);
2)在 GridView 下面,放置一個(gè)普通的 HTML 表格,其列數(shù)和 GridView 中定義的列數(shù)保持一致,但行數(shù)只有一行,然后在此表格的各列中放入用于新增功能的各個(gè)控件(如 TextBox等),假設(shè)此表格的 ID 為 tbForm
3)在頁(yè)面中加入一段客戶端腳本,以便使頁(yè)面展示到客戶端時(shí),利用 Javascript 將兩個(gè)表格強(qiáng)行合并到一起,這樣就可以將只有一行的 tbForm 合并到 GridView中,因此 GridView 的最下面多出一行,其中有 tbForm 表格中定義的輸入控件和“添加”鏈接(按鈕),主要代碼(JavaScript)如下:
function MergeTable(source,dest)
{
var row;
var cell;
var sourceTb = document.all(source);
var destTb = document.all(dest);
for (var i=0; i<sourceTb.rows.length; i++)
{
row = document.createElement("TR");
for (var j=0; j<sourceTb.rows(i).cells.length; j++)
{
cell = document.createElement("TD");
row.appendChild(cell);
//復(fù)制對(duì)象
for(k=0;k<sourceTb.rows(i).cells(j).all.length;k++)
cell.appendChild(sourceTb.rows(i).cells(j).all.item(k));
}
destTb.tBodies(0).appendChild(row);
}
for (var i=sourceTb.rows.length-1; i>=0; i--)
{
sourceTb.deleteRow(i)
}
}
function ChangeTableLayout()
{
if(document.all('tbHeader') == null)
MergeTable('tbForm','');
else
MergeTable('tbForm','tbHeader');
}
ChangeTableLayout();
如果 GridView 綁定時(shí)沒(méi)有數(shù)據(jù),將不顯示其中定義的各列,而只顯示 EmptyDataView 中的 tbHeader,這時(shí)要合并 tbHeader 和 tbForm。如果 GridView 綁定時(shí)包含數(shù)據(jù),則不會(huì)顯示 EmptyDataView(當(dāng)然也不會(huì)顯示其中的 tbHeader),但這時(shí)會(huì)顯示 GridView 中定義的各個(gè)列,因此只需將 GridView 本身和 tbForm 合并即可。 GridView 的客戶端ID可以用GridView.ClientID來(lái)獲取。
在服務(wù)器端很容易知道 GridView 綁定后是否包含數(shù)據(jù),但對(duì)于客戶端來(lái)說(shuō),不容易檢查,一個(gè)簡(jiǎn)單的作法就是檢查頁(yè)面中有沒(méi)有 tbHeader 對(duì)象(如果有,則說(shuō)明表格沒(méi)有數(shù)據(jù),如果無(wú)此對(duì)象,表示 GridView 中包含數(shù)據(jù)... 好啰嗦)
4)如果是 AJAX 環(huán)境,上述腳本有可能不被執(zhí)行,可以調(diào)用 Sys.Application.load.add ( JavaScriptFunction) 來(lái)強(qiáng)制執(zhí)行腳本,來(lái)合并表格,主要代碼如下(C#):
ScriptManager myScriptManager = ScriptManager.GetCurrent(Page);
if (myScriptManager.IsInPartialRenderingMode)
{
Page.ClientScript.RegisterStartupScript(this.GetType(), "ShowFullTable1", "ChangeTableLayout();\n", true);
}
else
{
Page.ClientScript.RegisterStartupScript(this.GetType(), "ShowFullTable2", "Sys.Application.load.add (ChangeTableLayout);\n", true);
}
注:上述代碼中的 ChangeTableLayout 為客戶端腳本函數(shù)的名稱(chēng),其中調(diào)用第3步驟中的代碼,上述代碼在 Atlas 中通過(guò),在 ASP.NET AJAX Beta 上尚末測(cè)試。
另:為了更能說(shuō)明上文代碼的效果,我抓了一個(gè)截圖,圖中包括表頭在內(nèi)的前三行就是 GridView,最下面一行其實(shí)來(lái)自于另一個(gè)表格,在客戶端強(qiáng)制合并后,顯示效果就是這樣,看起來(lái)象是一個(gè)表格。
通過(guò)實(shí)踐,想出了一種辦法,主要步驟如下所示:
1) 在 GridView 的 EmptyDataView 中,放置一個(gè)普通的Html Table,以便在GridView綁定的數(shù)據(jù)源中無(wú)數(shù)據(jù)時(shí)依舊顯示表頭(如果數(shù)據(jù)源為返回的數(shù)據(jù)行數(shù)為0,GridView默認(rèn)是不顯示表頭的),假設(shè) ID 為 tbHeader,它的作用是下面用于新增功能的 tbForm 的各列控件提供說(shuō)明(充當(dāng)表頭);
2)在 GridView 下面,放置一個(gè)普通的 HTML 表格,其列數(shù)和 GridView 中定義的列數(shù)保持一致,但行數(shù)只有一行,然后在此表格的各列中放入用于新增功能的各個(gè)控件(如 TextBox等),假設(shè)此表格的 ID 為 tbForm
3)在頁(yè)面中加入一段客戶端腳本,以便使頁(yè)面展示到客戶端時(shí),利用 Javascript 將兩個(gè)表格強(qiáng)行合并到一起,這樣就可以將只有一行的 tbForm 合并到 GridView中,因此 GridView 的最下面多出一行,其中有 tbForm 表格中定義的輸入控件和“添加”鏈接(按鈕),主要代碼(JavaScript)如下:
function MergeTable(source,dest)
{
var row;
var cell;
var sourceTb = document.all(source);
var destTb = document.all(dest);
for (var i=0; i<sourceTb.rows.length; i++)
{
row = document.createElement("TR");
for (var j=0; j<sourceTb.rows(i).cells.length; j++)
{
cell = document.createElement("TD");
row.appendChild(cell);
//復(fù)制對(duì)象
for(k=0;k<sourceTb.rows(i).cells(j).all.length;k++)
cell.appendChild(sourceTb.rows(i).cells(j).all.item(k));
}
destTb.tBodies(0).appendChild(row);
}
for (var i=sourceTb.rows.length-1; i>=0; i--)
{
sourceTb.deleteRow(i)
}
}
function ChangeTableLayout()
{
if(document.all('tbHeader') == null)
MergeTable('tbForm','');
else
MergeTable('tbForm','tbHeader');
}
ChangeTableLayout();
如果 GridView 綁定時(shí)沒(méi)有數(shù)據(jù),將不顯示其中定義的各列,而只顯示 EmptyDataView 中的 tbHeader,這時(shí)要合并 tbHeader 和 tbForm。如果 GridView 綁定時(shí)包含數(shù)據(jù),則不會(huì)顯示 EmptyDataView(當(dāng)然也不會(huì)顯示其中的 tbHeader),但這時(shí)會(huì)顯示 GridView 中定義的各個(gè)列,因此只需將 GridView 本身和 tbForm 合并即可。 GridView 的客戶端ID可以用GridView.ClientID來(lái)獲取。
在服務(wù)器端很容易知道 GridView 綁定后是否包含數(shù)據(jù),但對(duì)于客戶端來(lái)說(shuō),不容易檢查,一個(gè)簡(jiǎn)單的作法就是檢查頁(yè)面中有沒(méi)有 tbHeader 對(duì)象(如果有,則說(shuō)明表格沒(méi)有數(shù)據(jù),如果無(wú)此對(duì)象,表示 GridView 中包含數(shù)據(jù)... 好啰嗦)
4)如果是 AJAX 環(huán)境,上述腳本有可能不被執(zhí)行,可以調(diào)用 Sys.Application.load.add ( JavaScriptFunction) 來(lái)強(qiáng)制執(zhí)行腳本,來(lái)合并表格,主要代碼如下(C#):
ScriptManager myScriptManager = ScriptManager.GetCurrent(Page);
if (myScriptManager.IsInPartialRenderingMode)
{
Page.ClientScript.RegisterStartupScript(this.GetType(), "ShowFullTable1", "ChangeTableLayout();\n", true);
}
else
{
Page.ClientScript.RegisterStartupScript(this.GetType(), "ShowFullTable2", "Sys.Application.load.add (ChangeTableLayout);\n", true);
}
注:上述代碼中的 ChangeTableLayout 為客戶端腳本函數(shù)的名稱(chēng),其中調(diào)用第3步驟中的代碼,上述代碼在 Atlas 中通過(guò),在 ASP.NET AJAX Beta 上尚末測(cè)試。
另:為了更能說(shuō)明上文代碼的效果,我抓了一個(gè)截圖,圖中包括表頭在內(nèi)的前三行就是 GridView,最下面一行其實(shí)來(lái)自于另一個(gè)表格,在客戶端強(qiáng)制合并后,顯示效果就是這樣,看起來(lái)象是一個(gè)表格。
您可能感興趣的文章:
- asp.net中GridView編輯,更新,合計(jì)用法示例
- asp.net實(shí)現(xiàn)固定GridView標(biāo)題欄的方法(凍結(jié)列功能)
- asp.net GridView控件中模板列CheckBox全選、反選、取消
- asp.net下gridview 批量刪除的實(shí)現(xiàn)方法
- Asp.net GridView使用大全(分頁(yè)實(shí)現(xiàn))
- asp.net gridview代碼綁定
- asp.net GridView 刪除時(shí)彈出確認(rèn)對(duì)話框(包括內(nèi)容提示)
- asp.net Gridview里添加匯總行
- asp.net中讓Repeater和GridView支持DataPager分頁(yè)
- ASP.NET Gridview與checkbox全選、全不選實(shí)現(xiàn)代碼
- asp.net GridView導(dǎo)出到Excel代碼
- asp.net Checbox在GridView中的應(yīng)用實(shí)例分析
相關(guān)文章
ASP.NET使用My97DatePicker日期控件實(shí)例
這篇文章主要為大家詳細(xì)介紹了ASP.NET使用My97DatePicker日期控件實(shí)例,如何使用My97DatePicker日期控件,本文為大家介紹,感興趣的小伙伴們可以參考一下2016-04-04
.NET 6開(kāi)發(fā)TodoList應(yīng)用之實(shí)現(xiàn)接口請(qǐng)求驗(yàn)證
在響應(yīng)請(qǐng)求處理的過(guò)程中,我們經(jīng)常需要對(duì)請(qǐng)求參數(shù)的合法性進(jìn)行校驗(yàn),如果參數(shù)不合法,將不繼續(xù)進(jìn)行業(yè)務(wù)邏輯的處理。本文將介紹如何使用FluentValidation和MediatR實(shí)現(xiàn)接口請(qǐng)求驗(yàn)證,需要的可以參考一下2021-12-12
asp.net得到本機(jī)數(shù)據(jù)庫(kù)實(shí)例的兩種方法代碼
這篇文章介紹了asp.net得到本機(jī)數(shù)據(jù)庫(kù)實(shí)例的兩種方法代碼,有需要的朋友可以參考一下2013-07-07
asp.net core調(diào)用wps實(shí)現(xiàn)word轉(zhuǎn)pdf的過(guò)程
這篇文章主要介紹了asp.net core調(diào)用wps實(shí)現(xiàn)word轉(zhuǎn)pdf的過(guò)程,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧2024-08-08
將Access數(shù)據(jù)庫(kù)中數(shù)據(jù)導(dǎo)入到SQL Server中的詳細(xì)方法實(shí)例
將Access數(shù)據(jù)庫(kù)中數(shù)據(jù)導(dǎo)入到SQL Server中的詳細(xì)方法實(shí)例,需要的朋友可以參考一下2013-03-03
ASP.NET 4.0配置文件中的ClientIDMode屬性詳解
在ASP.NET 4.0中的每個(gè)控件上都多了一個(gè)叫做ClientIDMode的屬性,本文主要介紹了ASP.NET 4.0配置文件中的ClientIDMode屬性詳解,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2018-11-11
.net 像hao123的快捷郵箱登陸的實(shí)現(xiàn)代碼
.net實(shí)現(xiàn)的像hao123的快捷郵箱登陸的代碼,需要的朋友可以參考下。2010-03-03

