结合js与asp.net web窗体进行程序开发

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

 

<% if bSurvey then %>

<SCRIPT>

window.open("/survey/displaysurvey.asp?q=" & bID,"SURVEY","width=350,height=400,top=0,left=0,scrollbars=yes")

</SCRIPT>

<% end if %>

 

string   str="";  
  str="window.open   ('page.html',   'newwindow',   'height=100,   width=400,   top=0,   left=0,   toolbar=no,   menubar=no,   scrollbars=no,   resizable=no,location=n   o,   status=no')"   //这句要写成一行  
  Response.Write(str);  
   
  window.open   弹出新窗口的命令;    
    'page.html'   弹出窗口的文件名;    
    'newwindow'   弹出窗口的名字(不是文件名),非必须,可用空''代替;    
    height=100   窗口高度;    
    width=400   窗口宽度;    
    top=0   窗口距离屏幕上方的象素值;    
    left=0   窗口距离屏幕左侧的象素值;    
    toolbar=no   是否显示工具栏,yes为显示;    
    menubar,scrollbars   表示菜单栏和滚动栏。    
    resizable=no   是否允许改变窗口大小,yes为允许;    
    location=no   是否显示地址栏,yes为允许;    
    status=no   是否显示状态栏内的信息(通常是文件已经打开),yes为允许;

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值