程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> .NET網頁編程 >> .NET實例教程 >> 結合JavaScript與ASP.NET Web窗體進行程序開發

結合JavaScript與ASP.NET Web窗體進行程序開發

編輯:.NET實例教程

  ASP.Net為Web程序開發提供了新的范例。其中包括一系列基於服務器的控件,這些控件類似於Html窗體中諸如文本框、按鈕等元素。使用這些控件的問題是必須調用服務器。Javascript為很多任務提供多種選擇的機會,而這些過程不需要調用服務器。讓我們來看結合JavaScript與ASP.Net所帶來的強大功能。

    性能是必需的
 
  
    調用服務器要求帶寬和服務器處理時間,然而對一個可以享受高速流通的局域網程序將不會有任何問題,但是在廣域網中就是不同的情況。一個因特網用戶連接速度的不同主要取決於用戶的撥號調制解調器、帶寬或者電纜調制解調器。使用用戶型的JavaScript可以不需要調用服務器。

    傳統方法
    一個標准的網頁窗體包括像標題框、正文和窗體在內的頁面。JavaScript函數按傳統方法被放置在網頁窗體的標題框,這些函數允許被頁面的其它部分載入和利用,一旦被載入,這些函數將從Html元素中調用。

讓我們看看一個簡單的JavaScript的例子:

function valSubmit() {
var doc = document.forms[0];
varmsg = "";
if (doc.firstName.value == "") {

msg += "- Please enter a first name.n";
}

if (doc.lastName.value == "") {
msg += "- Please enter a last name.n";
}

if (msg == "") {
doc.submit();
} else {
alert("The following errors were
encountered.nn" + msg);
} }

    這一函數將檢驗數據被傳送到窗體中的兩個HIML區。如果其中一個區是空的,將顯示錯誤信息並且停止運行。如果兩個區都有值時,窗體被提交,你可以使用以下的代碼調用這一函數:

<input type="button" value="submit"
name="btnSubmit" onClick="valSubmit();">

    利用這一關系,在HIML區沒有數據之前,窗體是不會被提交的。這樣我們可以看到,代碼變得更加簡單,但是由於無需調用額外的服務器而不會產生任何副作用。JavaScript簡短而實用,這就意味著窗體不需要額外的載入時間。

    ASP.NET網頁窗體允許使用標准的Html,因此你可以容易地使用前面的范例。ASP.NET用戶控件允許你很輕松地調用服務器代碼來處理Web窗體。慶幸的是,用戶控件和JavaScript的結合使用完全是可以的。我將利用一個ASP.Net按鈕控件的例子來說明這一使用過程。


  
    按鈕控件的所有屬性提供了將Javascript連接到控件的方式。首先,將JavaScript函數放置在ASP.Net網頁窗體中,但是通過添加返回值可以改變放置的方法。如果確認通過,函數值返回為真,與按鈕相關的服務器函數就會別調用。如果返回值為假,則窗體不會被提交。

<%@ Page language="c#" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD Html 4.0 Transitional//EN" >
<Html><head>
<title>WebForm1</title>
<script language="Javascript">
function valSubmit() {
var doc = document.forms[0];
varmsg = "";
if (doc.firstName.value == "") {
msg += "- Please enter a first name.n";
}
if (doc.lastName.value == "") {
msg += "- Please enter a last name.n";
}
if (msg == "") {
doc.submit();
return true;
} else {
alert("The following errors were encountered.nn" + msg);
return false;
} }
</script>
<script language="C#" runat="server">
private void btnSearch_Click(object sender, System.EventArgs e) {
Response.Write("Search");
}
private void Page_Load(object sender, System.EventArgs e) {
btnSubmit.Attributes.Add("onClick", "return valSubmit();");
}
</script></head>
<body>
<form id="frmBuilderTest" method="post" runat="server">
<label >
First Name:</label>
<input
type="text" name="firstName" id="firstName">
<label >
Last Name:<
/label>
<input
type="text" name="lastName" id="lastName"><br /><br />
<ASP:Button id="btnSubmit" MARGIN: 0px">TOP: 128px" runat="server" Text="Submit" Width="136px"
OnClick="btnSearch_Click"></ASP:Button>
</form></body></Html>

這些代碼中最為關鍵的一行是:

btnSubmit.Attributes.Add("onClick", "return valSubmit();");

    通過風格屬性使用CSS可以將元素放置在HIML窗體。窗體將JavaScript函數和ASP.NET 按鈕 (btnSubmit)以及Html的onClick事件連接起來。在窗體被提交給服務器時,ASP.Net Button 中的onClick屬性會通知系統調用哪些函數。

如果你是一名VB.NET開發人員,對於前面代碼,只需要改變代碼中的C#模塊。VB.Net相應的代碼如下:

<script language="vb" runat="server">
Private btnSearch_Click (sender As Object, e As System.EventArgs)
Response.Write("Search")
End Sub
Private Page_Load(sender As Object, e As System.EventArgs)
btnSubmit.Attributes.Add("onClick", "return valSubmit();")
End Sub
</script>

功能強大的JavaScript和ASP.Net結合
    JavaScript是面向用戶網頁開發的實用標准語言,它與ASP.Net Web窗體的結合,為開發人員提供了一個功能強大的用於構建穩固程序的工具集,而程序的穩固性被認為軟件性能的一個關鍵組成部分。


----------------------------------------
作者簡介:Tony Patton是一個應用開發程序員,獲得Java, VB, Lotus和XML證書,知識面廣泛。

  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved