当前位置: 首页 > 图文教程 > 网络编程 > ASP.NET > 结合JavaScript与ASP.NET Web窗体进行程序开发

ASP.NET
如何在ASP.NET中使用SmtpMail发送邮件
在VB.NET中利用Split和Replace函数计算字数
Attribute应用:简化ANF自定义控件初始化过程
ASP.NET 2.0移动开发入门之使用样式
ASP.NET 2.0中使用OWC生成图表
ASP.NET 2.0中控件的简单异步回调
一个无法捕获ADO.NET Dataset的内存错误
深入解读ADO.NET2.0的十大最新特性
.Net平台下的分布式缓存设计
ASP.NET全局异常处理浅析
ASP.NET 2.0中文验证码的实现
浅析.NET平台编程语言的未来走向
.net 框架程序设计收藏
使用ASP.NET MVC Futures 中的异步Action
详解.NET中的XmlReader与XmlWriter
关于.NET中的Server push技术
asp.net页面执行机制
对比JSP和ASP.NET的存储过程
.NET 4.0不会包含System.Shell.CommandLine
ASP.NET十个有效性能优化的方法

结合JavaScript与ASP.NET Web窗体进行程序开发


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-09-23   浏览: 195 ::
收藏到网摘: n/a

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区。如果其中一个区是空的,将显示错误信息并且停止运行。如果两个区都有值时,窗体被提交,你可以使用以下的代码调用这一函数:


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

 

利用这一关系,在HIML区没有数据之前,窗体是不会被提交的。这样我们可以看到,代码变得更加简单,但是由于无需调用额外的服务器而不会产生任何副作用。JavaScript简短而实用,这就意味着窗体不需要额外的载入时间。

将JavaScript和ASP.NET结合在一起
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 style="Z-INDEX: 101; LEFT: 10px; POSITION: absolute; TOP: 48px">First Name:</label>
<input style="Z-INDEX: 102; LEFT: 88px; POSITION: absolute; TOP: 48px" type="text" name="firstName" id="firstName">
<label style="Z-INDEX: 103; LEFT: 10px; POSITION: absolute; TOP: 88px">Last Name:</label>
<input style="Z-INDEX: 104; LEFT: 88px; POSITION: absolute; TOP: 88px" type="text" name="lastName" id="lastName">
<br /><br />
<asp:Button id="btnSubmit" style="Z-INDEX: 105; LEFT: 64px; POSITION: absolute;
  TOP: 128px" runat="server" Text="Submit" Width="136px" OnClick="btnSearch_Click"></asp:Button>
</form>
</body>
</html>
这些代码中最为关键的一行是:

1btnSubmit.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窗体的结合,为开发人员提供了一个功能强大的用于构建稳固程序的工具集,而程序的稳固性被认为软件性能的一个关键组成部分。