页面开发技巧

简介:

1、提交后的回发时能自动进入上次的当前位置

例如,如果数据项导致大型页回发,则最终用户需要将页滚动到此前正在编辑它们的位置,才能继续。页开发人员通过以下方法可以简单地标记窗体,以维持滚动位置:在 @Page 指令中将 MaintainScrollPositionOnPostBack 属性设置为 true,或在 Web.config 中进行此设置,以应用于应用程序中的所有页。

2、Button 控件的 OnClientClick 属性允许您在此按钮被单击时以编程方式运行客户端脚本。该按钮呈现客户端 onclick 属性以及按钮自身的 Javascript。

3、用于控件的一个令人惊喜的新功能是“客户端回调”,该功能允许控件向服务器执行带外请求以获取附加数据,而不发送整页。此功能依赖于用于回调处理(通常通过 XMLHTTP)的浏览器支持,该支持由 SupportsClientCallbacks 在浏览器功能中指定。

其实一般的无刷新页面就可以使用客户端回调来实现,只有复杂的才需要使用AJAX等

None.gif <% @ Page Language = " C# "  AutoEventWireup = " true "  EnableEventValidation = " false "  CodeFile = " CallBackEventHandler_cs.aspx.cs "  Inherits = " CallBackEventHandler_cs "   %>
None.gif
None.gif
<! DOCTYPE html PUBLIC  " -//W3C//DTD XHTML 1.0 Transitional//EN "   " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " >
None.gif
None.gif
< html xmlns = " http://www.w3.org/1999/xhtml "   >
None.gif
< head runat = " server " >
None.gif   
< title > Client CallBack </ title >
None.gif
</ head >
None.gif
< body >
None.gif
< form id = " Form1 "  runat = " server " >
None.gif
None.gif   
< h3 > Cascading DropDownLists Using ICallBackEventHandler </ h3 >
None.gif   
< asp:DropDownList ID = " ParentDropDown "
None.gif    onchange
= " GetChildren(this.options[this.selectedIndex].value, 'ddl'); "    
None.gif    Runat
= " server " >
None.gif     
< asp:ListItem Text = " Item 1 "   />
None.gif     
< asp:ListItem Text = " Item 2 "   />
None.gif     
< asp:ListItem Text = " Item 3 "   />
None.gif   
</ asp:DropDownList >
None.gif   
< asp:DropDownList ID = " ChildDropDown "  AutoPostBack = " true "  style = " visibility:hidden "  Runat = " Server " >
None.gif    
< asp:ListItem Text = " Child Item "   />
None.gif   
</ asp:DropDownList >
None.gif   
< br  />< br  />
None.gif   
< asp:Label ID = " Label1 "  runat = " server " />
None.gif
None.gif   
< script type = " text/javascript " >
None.gif
ExpandedBlockStart.gif   function ClientCallback(result, context)
{
InBlock.gif
InBlock.gif      var childDropDown 
= document.forms[0].elements['<%=ChildDropDown.UniqueID%>'];
InBlock.gif
ExpandedSubBlockStart.gif      
if (!childDropDown){
InBlock.gif         
return;
ExpandedSubBlockEnd.gif      }

InBlock.gif
InBlock.gif      childDropDown.length 
= 0;
InBlock.gif
ExpandedSubBlockStart.gif      
if (!result){
InBlock.gif          
return;
ExpandedSubBlockEnd.gif      }

InBlock.gif      
InBlock.gif      var rows 
= result.split('|'); 
ExpandedSubBlockStart.gif      
for (var i = 0; i < rows.length; ++i){
InBlock.gif         var option 
= document.createElement("OPTION");
InBlock.gif         option.value 
= rows[i];
InBlock.gif         option.innerHTML 
= rows[i];     
InBlock.gif         childDropDown.appendChild(option);
ExpandedSubBlockEnd.gif      }

InBlock.gif      
InBlock.gif      childDropDown.style.visibility 
= "visible";
ExpandedBlockEnd.gif   }

None.gif
ExpandedBlockStart.gif   function ClientCallbackError(result, context)
{
InBlock.gif      alert(result);
ExpandedBlockEnd.gif   }

None.gif
None.gif   
</ script >
None.gif
None.gif
</ form >
None.gif
</ body >
None.gif
None.gif
</ html >
None.gif

None.gif // -----------------------------------------------------------------------
None.gif
//   This file is part of the Microsoft .NET SDK Code Samples.
None.gif
//  
None.gif
//   Copyright (C) Microsoft Corporation.  All rights reserved.
None.gif
//  
None.gif
// This source code is intended only as a supplement to Microsoft
None.gif
// Development Tools and/or on-line documentation.  See these other
None.gif
// materials for detailed information regarding Microsoft code samples.
None.gif
//  
None.gif
// THIS CODE AND INFORMATION ARE PROVIDED AS IS WITHOUT WARRANTY OF ANY
None.gif
// KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE
None.gif
// IMPLIED WARRANTIES OF MERCHANTABILITY AND/OR FITNESS FOR A
None.gif
// PARTICULAR PURPOSE.
None.gif
// -----------------------------------------------------------------------
None.gif

None.gif
using  System;
None.gif
using  System.Web.UI;
None.gif
None.gif
public  partial  class  CallBackEventHandler_cs : System.Web.UI.Page, ICallbackEventHandler
ExpandedBlockStart.gif
{
InBlock.gif    
private string _callbackResult;
InBlock.gif
InBlock.gif    
private void Page_Load(object source, EventArgs e)
ExpandedSubBlockStart.gif    
{
InBlock.gif        String callBack 
= Page.ClientScript.GetCallbackEventReference(this"arg""ClientCallback""context""ClientCallbackError"false);
InBlock.gif        String clientFunction 
= "function GetChildren(arg, context){ " + callBack + "; }";
InBlock.gif        Page.ClientScript.RegisterClientScriptBlock(
this.GetType(), "GetChildren", clientFunction, true);
InBlock.gif
InBlock.gif        
if (Page.IsPostBack && !Page.IsCallback)
ExpandedSubBlockStart.gif        
{
InBlock.gif            Label1.Text 
= "You Selected: " + Request.Form["ParentDropDown"+ "" + Request.Form["ChildDropDown"];
ExpandedSubBlockEnd.gif        }

ExpandedSubBlockEnd.gif    }

InBlock.gif
InBlock.gif    
public string GetCallbackResult()
ExpandedSubBlockStart.gif    
{        
InBlock.gif        
return _callbackResult;
ExpandedSubBlockEnd.gif    }

InBlock.gif
InBlock.gif    
public void RaiseCallbackEvent(string eventArgument)
ExpandedSubBlockStart.gif    
{
InBlock.gif        
switch (eventArgument)
ExpandedSubBlockStart.gif        
{
InBlock.gif            
case "Item 1":
InBlock.gif                _callbackResult 
= "One|Two|Three";
InBlock.gif                
break;
InBlock.gif            
case "Item 2":
InBlock.gif                _callbackResult 
= "Four|Five|Six";
InBlock.gif                
break;
InBlock.gif            
case "Item 3":
InBlock.gif                _callbackResult 
= "Seven|Eight|Nine";
InBlock.gif                
break;
InBlock.gif            
default:
InBlock.gif                _callbackResult 
= "";
InBlock.gif                
break;
ExpandedSubBlockEnd.gif        }

ExpandedSubBlockEnd.gif    }

InBlock.gif
ExpandedBlockEnd.gif}

None.gif
    本文转自永春博客园博客,原文链接: http://www.cnblogs.com/firstyi/archive/2006/11/13/559156.html ,如需转载请自行联系原作者


相关文章
|
11月前
|
小程序
【微信小程序开发】自定义组件以及页面布局设计 )
【微信小程序开发】自定义组件以及页面布局设计 )
49 0
|
Web App开发 移动开发 前端开发
|
4月前
|
存储 JavaScript 前端开发
Vue.js表单开发宝藏工具集,让构建表单变得轻松又酷炫!
Vue Tiny Validate 是最小的验证库,如果你只需要最基本的功能,它可以帮你减轻负担。
38 3
|
4月前
|
Web App开发 传感器 编解码
移动WEB页面开发
移动WEB页面开发
|
11月前
|
前端开发 JavaScript UED
“ElementUI实现动态树和动态表格的综合应用“
“ElementUI实现动态树和动态表格的综合应用“
42 0
|
JavaScript 前端开发 C#
如何将现有的Blazor项目的主题切换写的更好看?
如何将现有的Blazor项目的主题切换写的更好看?
91 1
|
前端开发
前端换肤,聊一聊主题切换那些事
前端换肤,聊一聊主题切换那些事
175 0
|
前端开发
前端页面布局基础💕(一)
首先我们来了解一下盒子模型与行内块元素
185 5
前端页面布局基础💕(一)
|
存储 前端开发 搜索推荐
前端 “一键换肤“ 的几种方案
前端 “一键换肤“ 的几种方案
221 0
|
前端开发
「前端组件开发」越折腾越有趣,封装了一个表单组件
最近折腾代码简洁之路,先折腾了详情页,最近准备折腾一下表单组件,准备二次封装,提升代码复用率。
277 1