

下載本文檔
版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請進(jìn)行舉報或認(rèn)領(lǐng)
文檔簡介
1、.JAVASCRIPT技術(shù)在ASP.NET中的使用心態(tài)決定狀態(tài),心胸決定格局,眼界決定境界。當(dāng)你的眼淚忍不住要流出來的時候,睜大眼睛,千萬別眨眼,你會看到世界由清晰到模糊的全過程。概要 本文結(jié)合示例講述了在ASP.net應(yīng)用程序中如何利用客戶端的Javascript腳本提高程序的執(zhí)行效率并實現(xiàn)更多的功能。一、ASP.Net與Javascript.Net是微軟公司下一代的戰(zhàn)略核心,ASP.Net是.Net戰(zhàn)略在Web開發(fā)方面的具體實現(xiàn)。它繼承了ASP的簡單性和易用性,同時克服了ASP程序結(jié)構(gòu)化較差,難于閱讀和理解的缺點。特別是服務(wù)器端控件和事件驅(qū)動模式的引入,使得Web應(yīng)用程序的開發(fā)更接近于過去
2、桌面程序的開發(fā)。在各種各樣介紹ASP.Net的文章和書籍中,都把重點放在了服務(wù)器控件和.Net Framework SDK上,因為這是ASP.Net中最新和最具革命性的改進(jìn);與此相反,在過去的Web開發(fā)中占據(jù)重要地位的客戶端腳本Javascript(也包括VBScript)則鮮有提及,似乎有了服務(wù)器端程序,已經(jīng)不需要客戶端腳本了。但是,服務(wù)器端的程序畢竟需要一次瀏覽器與Web服務(wù)器的交互,對于ASP.Net來說,就是一次頁面的提交,需要來回傳送大量的數(shù)據(jù),而很多工作,比如輸入驗證或者刪除確認(rèn)等,完全可以用Javascript來實現(xiàn)。因此,探討在ASP.Net中如何使用Javascript仍然很
3、有必要。二、Javascript的應(yīng)用示例1為頁面上的某個服務(wù)器控件添加Javascript事件服務(wù)器控件最終生成的仍然是普通的HTML,比如<asp:textbox>生成input text。表單中的每個HTML控件都有它自己的Javascript事件,比如Textbox有onchange事件,Button有onclick事件,Listbox有onchange事件等。要想為服務(wù)器控件添加客戶端的事件,需要用到Attributes屬性。Attributes屬性是所有的服務(wù)器控件都有的一個屬性,它用來為最終生成的HTML添加自定義的一些標(biāo)記。假設(shè)Web Form上有一個保存按鈕btn
4、Save,希望在用戶點此按鈕時提示用戶是否確實要保存(比如一旦保存就無法恢復(fù)等),則應(yīng)在Page_Load事件中添加如下代碼:if not page.isPostBack() thenbtnSave.Attributes.Add(“onclick”,”Javascript:return confirm(Are you sure to save");”)end if要注意的是return,這是不可省的,否則即使用戶點了取消,數(shù)據(jù)仍然會保存。2為Datagrid中的每一行添加Javascript事件假設(shè)Datagrid的每一行有一個刪除按鈕,希望在用戶點此按鈕時提示用戶是否確實要刪除此條
5、記錄,以防用戶點錯了行,或僅僅是無意中點了刪除按鈕。無論這個刪除按鈕是什么名字,都不能象上個例子那樣直接引用,因為每一行都有這樣一個按鈕,它們是Datagrid中的子控件。在這種情況下,需要用到Datagrid的OnItemDataBound事件。OnItemDataBound事件發(fā)生在Datagrid的每一行數(shù)據(jù)綁定到Datagrid之后(即一行激發(fā)一次)。首先在Datagrid的聲明中添加如下代碼:<asp:datagrid id="grd1" runat="server" OnItemDataBound = "ItemDataBou
6、nd" >Columns definition here</asp:datagrid> 此處說明OnItemDataBound事件發(fā)生時調(diào)用ItemDataBound方法,在代碼后置文件中添加此方法的定義:Sub ItemDataBound(ByVal sender As Object, ByVal e As DataGridItemEventArgs)If e.Item.ItemType <> ListItemType.Header And e.Item.ItemType <> ListItemType.Footer ThenDim oDe
7、leteButton As LinkButton = e.Item.Cells(5).Controls(0)oDeleteButton.Attributes("onclick") = "javascript:return Confirm ('Are you sure you want to delete" & DataBinder.Eval(e.Item.DataItem, "m_sName") & "')"End IfEnd Sub由于Datagrid的標(biāo)題行和腳注行也會激發(fā)此事件
8、,所以首先判斷激發(fā)此事件的行不是標(biāo)題行和腳注行。 這里假設(shè)Delete按鈕位于Datagrid的第6列(第一列是0),且Datagrid的Datasource中包含名為”m_sName”的列3引用編輯狀態(tài)下的Datagrid中的控件Datagrid的內(nèi)置編輯功能使得當(dāng)記錄的字段較少時的一種編輯方法。用戶不必進(jìn)入一個單獨的頁面編輯記錄,而是直接點編輯按鈕就可以使當(dāng)前行進(jìn)入編輯模式。而另一方面,有一些Javascript程序需要引用控件的名稱。比如,很多程序在需要用戶輸入日期時都提供一個日期控件以保證日期格式的合法性,當(dāng)用戶點控件圖標(biāo)時彈出一個新窗口供用戶選擇日期。此時需要把顯示日期的文本框的ID
9、提供給新窗口,以便當(dāng)用戶選擇日期后值可以回填到文本框中。如果是普通的服務(wù)器文本框控件,它的ID與生成的HTML輸入框的ID是相同的;但是在Datagrid的編輯狀態(tài)下,兩個ID并不相同(其道理與上例相同),這就需要用到控件的ClientID屬性。Protected Sub ItemEdit(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridmandEventArgs)Dim sDateCtrl as stringsDateCtrl = grd1. Items (e.Item.ItemIndex) . Cel
10、ls(2). FindControl("txtDate") . ClientIDEnd Sub這里假設(shè)ItemEdit方法是Dategrid的OnItemEdit事件處理程序,同時在Datagrid的第三列包含一個名為txtDate的服務(wù)器文本框控件。4引用ASP.Net自動生成的Javascript程序所謂的“服務(wù)器端控件”是針對開發(fā)人員的,在生成的HTML源程序中并沒有服務(wù)器和客戶端之分,都是標(biāo)準(zhǔn)的HTML,DHTML和Javascript。它之所以能響應(yīng)用戶的輸入是因為每個控件的事件處理程序最終都生成了一段腳本,此腳本重新提交頁面使得Web Server有機(jī)會再次響應(yīng)
11、并作出處理。通常情況下我們不必知道此腳本是什么也不必直接調(diào)用此腳本,但在有些情況下,適當(dāng)?shù)卣{(diào)用此腳本可以簡化許多工作。請看下面兩個例子。 點Datagrid的任一位置以選中一行Datagrid提供了一種內(nèi)置的選擇按鈕,當(dāng)點此按鈕時選中當(dāng)前行(可以設(shè)置SelectedItemStyle屬性以使當(dāng)前行有不同的外觀)。但用戶可能更習(xí)慣于點任意一個位置都能選中一行,如果完全自己實現(xiàn)這個功能相當(dāng)煩瑣。一個好的思路是添加一個選擇按鈕,但使此列隱藏,當(dāng)點任一行時調(diào)用此按鈕產(chǎn)生的Javascript腳本。Sub Item_Bound(ByVal sender As Object, ByVal e As Dat
12、aGridItemEventArgs )Dim itemType As ListItemTypeitemType = CType(e.Item.ItemType, ListItemType)If (itemType <> ListItemType.Header) And _(itemType <> ListItemType.Footer) And _(itemType <> ListItemType.Separator) ThenDim oSelect As LinkButton = CType(e.Item.Cells(5).Controls(0), Li
13、nkButton)e.Item.Attributes("onclick") = Page. GetPostBackClientHyperlink (oSelect, ")End Sub這里假設(shè)選擇按鈕位于第6列。e.Item代表了一行,從生成的HTML上看就是在每個<tr>里增加了一個onclick事件。Page.GetPostBackClientHyperLink方法返回頁面中LinkButton控件產(chǎn)生的客戶端腳本,其中第一個參數(shù)是Linkbutton控件,第二個參數(shù)是傳遞給此控件的參數(shù),通常為空。如果不是LinkButton控件,有一個類似的函數(shù)
14、GetPostBackClientEvent,讀者可以參考MSDN。 服務(wù)器產(chǎn)生的腳本與手工添加的腳本沖突服務(wù)器控件的服務(wù)器事件一般對應(yīng)到客戶端控件的相應(yīng)事件,如Dropdownlist的SelectedIndexChanged事件對應(yīng)HTML <Select>的onchange事件。 如果你要手工增加一個onchange事件,則會在客戶端產(chǎn)生兩個onchange,瀏覽器就會忽略掉一個。比如用戶希望每當(dāng)改變了Dropdownlist中的選項就保存到數(shù)據(jù)庫(雖然不是很常見,但確實有這種需要),但同時還希望提醒用戶是否確實要做保存。顯然,保存的代碼應(yīng)該放在SelectedIndexCh
15、anged事件中,而提醒的工作應(yīng)該手工加一段onchange事件。結(jié)果就是兩個onchange只能執(zhí)行一個。正確的方法應(yīng)該是添加一個不可見的保存按鈕,在手工增加的onchange事件中調(diào)用此按鈕生成的程序。Page_Load方法如下:Dim sCmd as string sCmd=Page.GetPostBackClientHyperlink(btnUpdate, ")If not page.isPostback thenDropdownlist1.Attributes.add("onchange","ConfirmUpdate("" & sCmd & "")")End ifConfirmUpdate函數(shù)如下<Script language=”javascript”>function ConfirmUpdate(cmd)if confirm(“Ar
溫馨提示
- 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲空間,僅對用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請與我們聯(lián)系,我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時也不承擔(dān)用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。
最新文檔
- 保密協(xié)議金融方面
- 影視行業(yè)制作管理與后期剪輯方案
- Unit8 lesson 6教學(xué)設(shè)計 - 2024-2025學(xué)年冀教版英語七年級上冊
- 川教版三上信息技術(shù)3.2 添加角色 教學(xué)設(shè)計
- 全國冀教版信息技術(shù)四年級上冊新授課 第7課 Internet Explorer下載 教學(xué)設(shè)計
- 2025年簡易網(wǎng)站服務(wù)合同5篇
- 19 食物與營養(yǎng) 教學(xué)設(shè)計-2024-2025學(xué)年科學(xué)三年級上冊蘇教版
- 電子支付商戶合作協(xié)議8篇
- 標(biāo)準(zhǔn)駕校培訓(xùn)合同范本8篇
- 河南砂漿環(huán)氧地坪施工方案
- 腦卒中患者的康復(fù)護(hù)理查房
- 酶工程技術(shù)在茶葉深加工中的應(yīng)用
- 人教版英語八年級下冊全冊教案教學(xué)設(shè)計及教學(xué)反思
- 02J401 鋼梯【含03年修改】圖集
- Android移動應(yīng)用開發(fā)基礎(chǔ)教程-教案
- 電梯結(jié)構(gòu)與原理-第2版-全套課件
- 《現(xiàn)代漢語》語音教學(xué)上課用課件
- 采購流程各部門關(guān)系圖
- 力士樂工程機(jī)械液壓培訓(xùn)資料(共7篇)課件
- 村光伏發(fā)電申請書
- 支氣管擴(kuò)張的護(hù)理PPT
評論
0/150
提交評論