Asp.Net 前后台交互小结

转自：http://blog.csdn.net/wlccomeon/article/details/17270427

  一、前台调用后台

        1、Asp控件

    例如在前台添加一个服务器控件Button

     

[html] view plaincopy

 

1. <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />  

双击，进入后台，可添加自己的代码，这里举一个简单的：

[csharp] view plaincopy

 

1. protected void Button1_Click(object sender, EventArgs e)  
2. {  
3.     Response.Write("服务器控件！");  
4. }     

 

        2、html控件

首先在表单中添加一个html控件或者仅仅一个a标签：

[javascript] view plaincopy

 

1. <form id="login">  
2. <a href="#" id="strLogin" name="strLogin" onclick="checkInfo()">登录</a>  
3. </form>  
4. 然后，添加Js函数来提交表单：  
5.         //登陆，提交表单  
6.         function Login() {  
7.             var form = document.forms["login"];    //获取要提交的表单的id  
8.             form.action = "default.aspx";                 //刷新的目标页面  
9.             form.method = "post";                           //form.method的默认数据提交方法是get,适用于服务器控件  
10.             form.submit();                                         //提交  
11.         }  

运行之后，点击“登陆”a标签，即可对default进行刷新，从而运行后台代码。需要注意的是，这种方法想要触发的后台代码必须写在Page_Load里。

首先添加一个a标签：

 

[html] view plaincopy

 

1. <a href="#" onclick="loginQuit()">退出</a>  

 

编写JS代码

 

[javascript] view plaincopy

 

1. //退出登录  
2. function loginQuit() {  
3.   
4.     $.ajax({  
5.         type: "Post",  
6.         url: "Exit.ashx",               //退出的一般处理程序  
7.         onSubmit: function () {  
8.   
9.         },  
10.   
11.         //判断结果是否正确  
12.         success: function (result) {  
13.             if (result == "T") {  
14.   
15.                 //隐藏登陆后，显示登陆前  
16.                 document.getElementById("loginAfter").style.display = "none";//隐藏  
17.                 document.getElementById("loginBefore").style.display = "block";//显示  
18.   
19.                 ////清空用户输入记录   
20.                 document.getElementById("UserName").value = "";  
21.                 document.getElementById("txtCode").value = "";  
22.                 document.getElementById("Password").value = "";  
23.             }  
24.             else {  
25.                 alert(‘退出失败!‘)  
26.             }  
27.         }  
28.     });  
29.   
30. }  

新建一个一般处理程序Exit.ashx，添加代码：

 

 

[csharp] view plaincopy

 

1. public void ProcessRequest(HttpContext context)  
2. {  
3.     context.Session["UserName"]=null;  
4.     context.Session["UserID"] = null;  
5.   
6.     context.Response.ContentType = "text/plain";  
7.   
8.     context.Response.Write("T");  
9. }  

后台代码就可以根据Session是否存在来进行自己的相关操作了。

 

二、后台调用前台

 

后台调用前台的方法有则有很多，目前我用到的大致有两种：

1、使用Response.Write方法

      该方法只能调用js内部自带的函数：

[csharp] view plaincopy

 

1. Response.Write("<script type=‘text/javascript‘>alert(‘成功!‘);</script>");  

如果在后台经常需要用到这个JS函数的话，可以抽象出为一个类（本例为 jumpFrame），在类中添加方法：

 

 

[csharp] view plaincopy

 

1. public static void AlertBox(string errMsg)  
2. {  
3.     StringBuilder sb = new StringBuilder();  
4.     sb.Append("<script language=\"javascript\"> \n");  
5.     sb.Append("alert(\"" + errMsg.Trim() + "\"); \n");  
6.     //sb.Append("window.location=‘test.aspx‘;\n");  
7.     sb.Append("</script>");  
8.   
9.     System.Web.HttpContext.Current.Response.Write(sb.ToString());  
10. }  

调用：

 

 

[csharp] view plaincopy

 

1. protected void Button1_Click(object sender, EventArgs e)  
2. {  
3.     jumpFrame.AlertBox("成功!");  
4. }  

 

2、用ClientScript类动态添加脚本

    这个方法可以使用JS自定义函数，用法如下：在想调用某个Javascript脚本函数的地方添加代码，注意要保证MyFun已经在脚本文件中定义过了。

[csharp] view plaincopy

 

1.   ClientScript.RegisterStartupScript(ClientScript.GetType(), "myscript", "<script>MyFun();</script>");  

 

    这些个方法从探索到实践到解决其中出现的各种问题到最后能够成功运用于所在的项目，费了很大很大的精力。在这次历练中对于没有接触到的知识能够简单的运用是一个非常好的学习过程，而对于已经看过相关的视频如新闻发布系统和北大青鸟课程则是一个很好的回顾的过程。学而不用，久而久之就会生疏甚至遗忘；而用中学则比单纯的看视频跟着敲代码掌握的更牢、体会的更深。最后，如果大家有更好的方法或者我在上面的运用有什么不妥的地方还请各位不吝指教！