DataList控件批量刪除數(shù)據(jù)方法的實現(xiàn)

袁芳　汪衛(wèi)平

摘要：在Web應(yīng)用程序開發(fā)中，DataList數(shù)據(jù)綁定控件使用頻率比較高，但DataList控件沒有內(nèi)置的刪除功能，需要手工編寫刪除代碼。批量刪除數(shù)據(jù)在網(wǎng)站和管理系統(tǒng)中應(yīng)用比較廣泛，本文介紹了利用Javascript和ASP.NET技術(shù)向DataList控件增加全選、取消選擇的功能，以及實現(xiàn)單條數(shù)據(jù)刪除和將選中的多條數(shù)據(jù)進行批量刪除的方法。

關(guān)鍵詞：DataList；批量刪除數(shù)據(jù)；控件

中圖分類號：TP391 文獻標(biāo)識碼：A

Abstract ： In the development of the web application， the DataList controls is used frequently，but it hasnt built_in delete function which needs to manually write delete code.Batch delete data in the web and management system is widely used in the application， This paper introduces the functions of selecting and deselecting for DataList control， also presents the realization of a single data delete method and batch delete the multiple selected data.

Key words： DataList；Batch delete Data； Control

0引言

隨著網(wǎng)絡(luò)技術(shù)的飛速發(fā)展，在Web應(yīng)用中，基于ASP.NET動態(tài)網(wǎng)站制作技術(shù)應(yīng)用得越來越廣泛。ASP.NET4.0中提供了多種數(shù)據(jù)綁定控件，用于在Web頁中顯示數(shù)據(jù)，這些數(shù)據(jù)綁定控件具有豐富的功能，如分頁、排序、刪除、更新和插入等功能。其中的DataList控件用得頻率比較高，但該控件沒有刪除、排序、分頁、編輯的內(nèi)置功能，也并沒有為用戶提供數(shù)據(jù)的復(fù)選、全選以及反選等相關(guān)功能的接口[1]，這些功能需要編程人員自行編寫，本文介紹了對DataList如何實現(xiàn)復(fù)選框全選和取消選擇數(shù)據(jù)的功能以及實現(xiàn)單條數(shù)據(jù)刪除和將選中的數(shù)據(jù)進行批量刪除的方法。

1DataList控件概述

DataList控件是功能強大的數(shù)據(jù)綁定控件，該控件能夠以某種預(yù)期設(shè)定的模板格式循環(huán)顯示多條數(shù)據(jù)，這種模板格式是可以根據(jù)實際需要進行自定義的。DataList控件能夠通過屬性控制布局樣式，比如流式布局（即依次排列）或表格式布局，并且還可以設(shè)置垂直方向或水平方向重復(fù)顯示多少條數(shù)據(jù)記錄[2]。

DataList控件與GridView、DetailsView、ListView控件有著明顯區(qū)別，最為突出的特點就是一定要通過模板來定義數(shù)據(jù)的顯示格式。DataList控件支持7種類型的模板，分別為ItemTemplate（項模板）、AlternatingItemTemplate（交替項模板）、HeaderTemplate（標(biāo)題模板）、FooterTemplate（腳注模板）、SeparatorTemplate（分隔符模板）、EditItemTemplate（編輯項模板）和 SelectedItemTemplate（選定項模板）[3]，正因為DataList控件顯示數(shù)據(jù)具有高度的靈活性，這就給開發(fā)人員提供了充分的個人才能展現(xiàn)和發(fā)揮空間。

2DataList批量刪除數(shù)據(jù)的設(shè)計與實現(xiàn)

2.1 Datalist控件模板列設(shè)計

本案例采用Visual Studio 2010開發(fā)環(huán)境，在新建的網(wǎng)站內(nèi)，添加asp.net頁面，從工具箱的數(shù)據(jù)欄中拖拽一DataList控件到該頁面中，單擊DataList控件右上方的的任務(wù)按鈕，選擇自動套用格式中“傳統(tǒng)型”樣式對DatatList控件美化，再單擊任務(wù)按鈕在彈出的任務(wù)快捷菜單中選擇“編輯模板”選項。打開“DataList任務(wù)——模板編輯模式”，在“顯示”下拉列表框中選擇“HeaderItemTemplate”選項，在頭模板中插入一張1行6列的表，第一個單元格置入復(fù)選框Input（checkbox）HTML控件，并單擊onclick值為“return All_Check（this）；”，該控件用于實現(xiàn)對復(fù)選框設(shè)置全選或全不選功能，設(shè)計如圖1所示。

在ItemTemplate模板中添加1行6列的表，在單元格中放入ASP.NET標(biāo)準(zhǔn)服務(wù)器控件，如圖2所示，一個CheckBox控件，3個Label控件，其Text屬性值分別為數(shù)據(jù)綁定表達式“<%# Eval（"Id"） %>”、“<%# Eval（"Name"） %>”和“<%# Eval（"Sex"） %>”，一個image控件，其ImageUrl 屬性值為<%# Eval（"FaceImg"） %>和一個Button“刪除”控件，該控件用于執(zhí)行當(dāng)條數(shù)據(jù)刪除的功能，將相應(yīng)的CommandName 屬性設(shè)置為“delete”值。

在FootTemplate模板中添加1行2列的表，拖動一個html控件Input（Button），設(shè)置其onclick值為"CancelSel（）"，再拖出一個標(biāo)準(zhǔn)控件Button控件，用于執(zhí)行批量刪除操作，同時設(shè)置其CommandName屬性為“pldelete”，如圖3所示。

2.2 全選、取消選擇的實現(xiàn)

在.aspx頁面的源碼的Head部分添加Javascript腳本語句實現(xiàn)上述HeaderTemplate模板中全選復(fù)選框的單擊方法All_Check（）方法和FooterTemplate模板中“取消選擇”Input（Button）按鈕的單擊方法CancelSel （）。實現(xiàn)全選和全不選代碼如下：

function All_Check（ckb）{

var DocObj=document.all；

if（ckb.checked） {//復(fù)選框全部選中

for（var i=0；iif（DocObj[i].type=="checkbox"）{

DocObj[i].checked=true；}}}

else……

else部分為全不選的代碼，這部分的代碼和if部分的代碼大致相同，只需把DocObj[i].checked設(shè)置為false即可。取消選擇的CancelSel（）方法代碼如下：

function CancelSel（） {

var DocObj=document.all；

for（var i=0；i