javascript在asp.net中運用

Net是微軟公司下一代的戰略核心，ASP.Net是.Net戰略在Web開發方面的具體實現。它繼承了ASP的簡單性和易用性，同時克服了ASP程序結構化較差，難於閱讀和理解的缺點。特別是服務器端控件和事件驅動模式的引入，使得Web應用程序的開發更接近於過去桌面程序的開發。

在各類各樣介紹ASP.Net的文章和書籍中，都把重點放在了服務器控件和.Net Framework SDK上，由於這是ASP.Net中最新和最具革命性的改進；與此相反，在過去的Web開發中佔據重要地位的客戶端腳本Javascript(也包括VBScript)則鮮有說起，彷佛有了服務器端程序，已經不須要客戶端腳本了。可是，服務器端的程序畢竟須要一次瀏覽器與Web服務器的交互，對於ASP.Net來講，就是一次頁面的提交，須要來回傳送大量的數據，而不少工做，好比輸入驗證或者刪除確認等，徹底能夠用Javascript來實現。所以，探討在ASP.Net中如何使用Javascript仍然頗有必要。 Javascript的應用示例

1．爲頁面上的某個服務器控件添加Javascript事件

服務器控件最終生成的仍然是普通的HTML,好比asp:textbox生成input text。表單中的每一個HTML控件都有它本身的Javascript事件，好比Textbox有onchange事件，Button有onclick事件，Listbox有onchange事件等。要想爲服務器控件添加客戶端的事件，須要用到Attributes屬性。Attributes屬性是全部的服務器控件都有的一個屬性，它用來爲最終生成的HTML添加自定義的一些標記。假設Web Form上有一個保存按鈕btnSave,但願在用戶點此按鈕時提示用戶是否確實要保存(好比一旦保存就沒法恢復等)，則應在Page_Load事件中添加以下代碼：

if not page.isPostBack() then

btnSave.Attributes.Add(「onclick」,」Javascript:return confirm(‘Are you sure to save?’);」) nd if

要注意的是‘return’，這是不可省的，不然即便用戶點了取消，數據仍然會保存。

2．爲Datagrid中的每一行添加Javascript事件

假設Datagrid的每一行有一個刪除按鈕，但願在用戶點此按鈕時提示用戶是否確實要刪除此條記錄，以防用戶點錯了行，或僅僅是無心中點了刪除按鈕。

不管這個刪除按鈕是什麼名字，都不能象上個例子那樣直接引用，由於每一行都有這樣一個按鈕，它們是Datagrid中的子控件。在這種狀況下，須要用到Datagrid的OnItemDataBound事件。OnItemDataBound事件發生在Datagrid的每一行數據綁定到Datagrid以後（即一行激發一次）。首先在Datagrid的聲明中添加以下代碼：

<asp:datagrid id="grd1" runat="server" OnItemDataBound = "ItemDataBound" > …Columns definition here

</asp:datagrid> 此處說明OnItemDataBound事件發生時調用ItemDataBound方法，在代碼後置文件中添加此方法的定義：

Sub ItemDataBound(ByVal sender As Object, ByVal e As DataGridItemEventArgs)

If e.Item.ItemType <> ListItemType.Header And e.Item.ItemType <> ListItemType.Footer Then

Dim oDeleteButton 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 If

End Sub

因爲Datagrid的標題行和腳註行也會激發此事件，因此首先判斷激發此事件的行不是標題行和腳註行。

這裏假設Delete按鈕位於Datagrid的第6列（第一列是0），且Datagrid的Datasource中包含名爲」m_sName」的列

3．引用編輯狀態下的Datagrid中的控件

Datagrid的內置編輯功能使得當記錄的字段較少時的一種編輯方法。用戶沒必要進入一個單獨的頁面編輯記錄，而是直接點編輯按鈕就可使當前行進入編輯模式。而另外一方面，有一些Javascript程序須要引用控件的名稱。好比，不少程序在須要用戶輸入日期時都提供一個日期控件以保證日期格式的合法性，當用戶點控件圖標時彈出一個新窗口供用戶選擇日期。此時須要把顯示日期的文本框的ID提供給新窗口，以便當用戶選擇日期後值能夠回填到文本框中。

若是是普通的服務器文本框控件，它的ID與生成的HTML輸入框的ID是相同的；可是在Datagrid的編輯狀態下，兩個ID並不相同（其道理與上例相同），這就須要用到控件的ClientID屬性。

Protected Sub ItemEdit(ByVal source As Object, ByVal e As System.Web.UI.WebControls.DataGridCommandEventArgs)

Dim sDateCtrl as string

sDateCtrl = grd1. Items (e.Item.ItemIndex) . Cells(2). FindControl("txtDate") . ClientID

End Sub

這裏假設ItemEdit方法是Dategrid的OnItemEdit事件處理程序，同時在Datagrid的第三列包含一個名爲txtDate的服務器文本框控件。

4．引用ASP.Net自動生成的Javascript程序

所謂的「服務器端控件」是針對開發人員的，在生成的HTML源程序中並無服務器和客戶端之分，都是標準的HTML,DHTML和Javascript。它之因此能響應用戶的輸入是由於每一個控件的事件處理程序最終都生成了一段腳本，此腳本從新提交頁面使得Web Server有機會再次響應並做出處理。一般狀況下咱們沒必要知道此腳本是什麼也沒必要直接調用此腳本，但在有些狀況下，適當地調用此腳本能夠簡化許多工做。請看下面兩個例子。 點Datagrid的任一位置以選中一行

Datagrid提供了一種內置的選擇按鈕,當點此按鈕時選中當前行（能夠設置SelectedItemStyle屬性以使當前行有不一樣的外觀）。但用戶可能更習慣於點任意一個位置都能選中一行，若是徹底本身實現這個功能至關煩瑣。一個好的思路是添加一個選擇按鈕，但使此列隱藏，當點任一行時調用此按鈕產生的Javascript腳本。

Sub Item_Bound(ByVal sender As Object, ByVal e As DataGridItemEventArgs )

Dim itemType As ListItemType

itemType = CType(e.Item.ItemType, ListItemType)

If (itemType <> ListItemType.Header) And _ (itemType <> ListItemType.Footer) And _

(itemType <> ListItemType.Separator) Then

Dim oSelect As LinkButton = CType(e.Item.Cells(5).Controls(0), LinkButton)

e.Item.Attributes("onclick") = Page. GetPostBackClientHyperlink (oSelect, "") End Sub

這裏假設選擇按鈕位於第6列。e.Item表明了一行，從生成的HTML上看就是在每一個<tr>裏增長了一個onclick事件。Page.GetPostBackClientHyperLink方法返回頁面中LinkButton控件產生的客戶端腳本，其中第一個參數是Linkbutton控件,第二個參數是傳遞給此控件的參數，一般爲空。若是不是LinkButton控件，有一個相似的函數GetPostBackClientEvent，讀者能夠參考MSDN。

● 服務器產生的腳本與手工添加的腳本衝突

服務器控件的服務器事件通常對應到客戶端控件的相應事件，如Dropdownlist的SelectedIndexChanged事件對應HTML <Select>的onchange事件。 若是你要手工增長一個onchange事件，則會在客戶端產生兩個onchange,瀏覽器就會忽略掉一個。好比用戶但願每當改變了Dropdownlist中的選項就保存到數據庫（雖然不是很常見，但確實有這種須要），但同時還但願提醒用戶是否確實要作保存。顯然，保存的代碼應該放在SelectedIndexChanged事件中，而提醒的工做應該手工加一段onchange事件。結果就是兩個onchange只能執行一個。正確的方法應該是添加一個不可見的保存按鈕，在手工增長的onchange事件中調用此按鈕生成的程序。

Page_Load方法以下：

Dim sCmd as string

sCmd=Page.GetPostBackClientHyperlink(btnUpdate, "")

If not page.isPostback then

Dropdownlist1.Attributes.add("onchange","ConfirmUpdate(""" & sCmd & """)")

End if

ConfirmUpdate函數以下

<Script language=」javascript」> function ConfirmUpdate(cmd){ if confirm(「Are you sure to update?」) eval(cmd); } </Script>

這裏利用了Javascript eval函數來調用一個字符串中包含的命令。需注意的是包含命令的字符串不能用單引號括起來，由於自動生成的腳本中包括單引號，因此這裏用兩個雙引號表示字符串自己的雙引號。

3、結束語

以上簡單討論了在ASP.Net中插入Javascript的幾種狀況。合理地在服務器程序中插入客戶端的Javascript腳本，能夠提升程序的運行效率並提供更友好的用戶界面 end,能夠試一下