您的位置:首页 > 编程语言 > ASP

要理解__doPostback函数的用法,首先我们要理解Asp.net 中服务端控件事件是如何触发的。 Asp.net 中在客户端触发服务端事件分为三种情况: 一. WebControls中

2017-07-18 15:27 751 查看
要理解__doPostback函数的用法,首先我们要理解Asp.net 中服务端控件事件是如何触发的。
Asp.net 中在客户端触发服务端事件分为三种情况:
 

一. WebControls中的Button 和HtmlControls中的Type为submit的HtmlInputButton

这两种按钮最终到客户端的表现形式为: <input name="Submit1" id="Submit1" type="submit" value="Submit">,这是Form表单的提交按钮,点击以后会作为参数发送到服务端,参数是这样的: 控件的name属性=控件的value值,对应上面的例子就是:Submit1= Submit。 服务端会根据接收到的控件的name属性的这个key来得知是这个按钮被点击了,从而在服务端触发这个按钮的点击事件。

 

二. ImageButton或者HttpInputImage:

这些控件到客户端的表现类似这样的: <input type=image id=img1>,点击了这样的控件会直接提交表单,作用同提交按钮。点击了这样的控件传到服务端的参数是这样的:id.x=nn&id.y=nn,对应到上面的例子就是:img1.x=nn&img1.y=nn

 

三. HtmlControls 中的 Type为button的HtmlInputButton 和其它所有的控件事件,比如LinkButton点击,TextBox的Change事件等等:

这些事件在客户端产生后会经过一个统一的机制发送到服务端。

 

1. 首先asp.net页框架会使用两个Hidden域来存放表示是哪个控件触发的事件,以及事件的参数

<!-表示触发事件的控件,一般是这个控件的name -->

<input type="hidden" name="__EVENTTARGET" value="" />

<!-表示触发事件的参数,一般是当某个控件有两个以上的事件时,用来区别是哪个事件 -->

<input type="hidden" name="__EVENTARGUMENT" value="" />

2. 服务端会生成一个jscript的方法来处理所有这些事件的发送,这段代码是:

 

[c-sharp] view
plaincopy

<mce:script language="javascript"><!--  

function __doPostBack(eventTarget, eventArgument) {  

  

var theform = document.WebForm2;  

  

theform.__EVENTTARGET.value = eventTarget;  

  

theform.__EVENTARGUMENT.value = eventArgument;  

  

theform.submit();  

  

}  

// --></mce:script>  

[c-sharp] view
plain copy

<mce:script language="javascript"><!--  

function __doPostBack(eventTarget, eventArgument) {  

  

var theform = document.WebForm2;  

  

theform.__EVENTTARGET.value = eventTarget;  

  

theform.__EVENTARGUMENT.value = eventArgument;  

  

theform.submit();  

  

}  

// --></mce:script>  

 

3. 每个会引发服务端事件的控件都会在响应的客户端事件中调用上面的代码:

比如,HtmlControls 中的 Type为button的HtmlInputButton的点击事件

<!-客户端的点击事件调用__doPostBack,eventTarget 参数为'Button2',表示是name为'Button2'控件触发的事件,eventArgument 为空,表示这个Type为button的HtmlInputButton只有一个客户端触发的服务端事件-->

<input language="javascript" onclick="__doPostBack('Button2','')" name="Button2" id="Button2" type="button" value="Button" />

 

又比如,TextBox控件的Change事件

<!-客户端的onchange事件调用__doPostBack,eventTarget 参数为'TextBox1',表示是name为'TextBox1'控件触发的事件,而TextBox控件只有一个客户端触发的服务端事件TextChanged,故服务器就会去触发这个TextBox的TextChanged事件->

<input name="TextBox1" type="text" id="TextBox1" onchange="__doPostBack('TextBox1','')" language="javascript" />

 

4. 客户端触发事件后调用__doPostBack方法,将表示触发的控件源的eventTarget 和事件参数eventArgument分别付给两个隐藏域__EVENTTARGET和__EVENTARGUMENT,然后提交Form,在服务端根据__EVENTTARGET和__EVENTARGUMENT来判断是哪个控件的什么事件触发了。

 

参考了这里的资料:http://tb.blog.csdn.net/TrackBack.aspx?PostId=12453

 
 

了解了Asp.net 中服务端控件事件是如何触发的后,我们再去认识__doPostback这个函数和它的作用。下面是__doPostback函数的具体内容:

[c-sharp] view
plaincopy

<div>  

<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />  

<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />  

<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTE4NDIzMDg2NDRkZMlHJoBQ9CYcWBtBK+zrfZzKoh/i" />  

</div>  

  

<mce:script type="text/javascript"><!--  

...  

<!--  

var theForm = document.forms['form1'];  

if (!theForm) ...{  

    theForm = document.form1;  

}  

function __doPostBack(eventTarget, eventArgument) ...{  

    if (!theForm.onsubmit || (theForm.onsubmit() != false)) ...{  

        theForm.__EVENTTARGET.value = eventTarget;  

        theForm.__EVENTARGUMENT.value = eventArgument;  

        theForm.submit();  

    }  

}  

// --></mce:script>  

    <div>  

[c-sharp] view
plain copy

<div>  

<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />  

<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />  

<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTE4NDIzMDg2NDRkZMlHJoBQ9CYcWBtBK+zrfZzKoh/i" />  

</div>  

  

<mce:script type="text/javascript"><!--  

...  

<!--  

var theForm = document.forms['form1'];  

if (!theForm) ...{  

    theForm = document.form1;  

}  

function __doPostBack(eventTarget, eventArgument) ...{  

    if (!theForm.onsubmit || (theForm.onsubmit() != false)) ...{  

        theForm.__EVENTTARGET.value = eventTarget;  

        theForm.__EVENTARGUMENT.value = eventArgument;  

        theForm.submit();  

    }  

}  

// --></mce:script>  

    <div>  

 

其中eventTarget 和eventArgument,是两个就是用来存储在回送的时候获取是哪个控件触发了回送,并且带了什么参数。总之,调用__doPostBack函数可以实现客户端控件调用服务器端控件的响应。或者是在javascript里面调用.net的服务器控件事件(这也是我想要解决的问题)。这一点可以充分用在子窗口调用父窗口中某个服务器控件的服务器端的事件

 

比如,在我们写程序的时候经常会需要动态的生成一些控件,最简单的方法就是通过一个字符串,比如string strButton = <input type ="button" ID="button1">,然后输出到页面,但是如果我们需要这个控件来执行一些服务器的功能,就比较困难了。

 

这里我们就可以用过借用 __doPostBack这个函数来完成。以这个例子来说明一下具体如何调用。

 

我们可以声明一个不可见的LinkButton控件,那通常,我们希望一个控件不可见,通常都是把visible属性设为false。但是在这里我们把LinkButton的Text属性设置为空,这样这个LinkButton不可见(因为当我们把visible属性设置为 false的时候,浏览器在解析的时候,根本不会把这个控件放在页面上,也就是说这个控件是不存在的,所以我们在调用__doPostBack函数的时候,便会找不到控件
),接下来我们可以在LinkButton里面写一些服务器端的代码。然后就是如何通过我们动态生成的客户端控件来调用LinkButton里面的功能,我们可以通过一个JavaScript函数来实现

 

[c-sharp] view
plaincopy

function ExcuteOnServer()  

{  

//第一个参数是你希望提交到服务器的控件的ID号,第二个参数是事件参数  

__doPostBack('LinkButtonID','');  

}  

[c-sharp] view
plain copy

function ExcuteOnServer()  

{  

//第一个参数是你希望提交到服务器的控件的ID号,第二个参数是事件参数  

__doPostBack('LinkButtonID','');  

}  

 

接下去我们只需要在动态生成的这个Button控件的onclick事件中写上onclick="JavaScript:ExcuteOnServer();",这样当我们点击这个动态生成的客户端控件的时候,他便会执行LinkButton中的代码。这样便实现了动态生成的客户端控件提交到服务器端的功能。

 

客户端js利用__doPostBack(sender,args)函数来提交到服务器的方法:

__doPostBack(sender,args)

sender:提交的控件

args: 事件参数。一般赋空值


web.aspx页面上放置任何一个控件:<asp:button id="btnTest"/>

客户端调用js代码:__doPostBack("btnTest",""); 注意是双下划线。即可提交到服务器端。调用该函数提交不会触发控件的任何js事件而直接进入服务器端。

 

可以利用该特性来做二次提交:在button控件的Click事件中做一个标记利用hidden控件或其他方式保存一个Flag

__doPostBack提交则无此Flag

服务器端则根据该Flag来判断是button提交还是__doPostBack提交。注意在后台处理__doPostBack提交的逻辑中将Flag刷新。

 

 

 
自己实践的例子如下,为了便于理解,举了一个比较简单的:
 
前台代码:

[c-sharp] view
plaincopy

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" EnableEventValidation="false"%>  

  

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  

<html xmlns="http://www.w3.org/1999/xhtml">  

<head runat="server">  

    <title></title>  

</head>  

<body>  

    <form id="form1" runat="server">  

    <input  onclick="__doPostBack('Button1','')" name="Button1" type="button" value="点击调用后台方法" />  

    <div>  

        <asp:Button ID="Button1" runat="server" Text="Button"  Visible="false"   

            onclick="Button1_Click"/>  

      <!--  <asp:DropDownList ID="DropDownList1" AutoPostBack="true" runat="server">  </asp:DropDownList>-->  

        <asp:LinkButton ID="LinkButton1" runat="server" Text = "">LinkButton</asp:LinkButton>  

    </div>  

    </form>  

</body>  

</html>  

[c-sharp] view
plain copy

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" EnableEventValidation="false"%>  

  

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  

<html xmlns="http://www.w3.org/1999/xhtml">  

<head runat="server">  

    <title></title>  

</head>  

<body>  

    <form id="form1" runat="server">  

    <input  onclick="__doPostBack('Button1','')" name="Button1" type="button" value="点击调用后台方法" />  

    <div>  

        <asp:Button ID="Button1" runat="server" Text="Button"  Visible="false"   

            onclick="Button1_Click"/>  

      <!--  <asp:DropDownList ID="DropDownList1" AutoPostBack="true" runat="server">  </asp:DropDownList>-->  

        <asp:LinkButton ID="LinkButton1" runat="server" Text = "">LinkButton</asp:LinkButton>  

    </div>  

    </form>  

</body>  

</html>  

 
 
注意EnableEventValidation属性要定义为false,因为它默认是true,否则无法回调。 为了实现__doPostBack函数,我们可以为页面添加一个LinkButton,因为它本身就有这个属性,或者可以添加其他控件,如DropDownList,但该控件AutoPostBack属性应该定义为true
 
后台代码:
 

[c-sharp] view
plaincopy

using System;  

using System.Collections.Generic;  

using System.Linq;  

using System.Web;  

using System.Web.UI;  

using System.Web.UI.WebControls;  

  

public partial class _Default : System.Web.UI.Page   

{  

    protected void Page_Load(object sender, EventArgs e)  

    {  

  

    }  

    protected void Button1_Click(object sender, EventArgs e)  

    {  

        Response.Write("成功调用后台方法!");  

    }  

}  

[c-sharp] view
plain copy

using System;  

using System.Collections.Generic;  

using System.Linq;  

using System.Web;  

using System.Web.UI;  

using System.Web.UI.WebControls;  

  

public partial class _Default : System.Web.UI.Page   

{  

    protected void Page_Load(object sender, EventArgs e)  

    {  

  

    }  

    protected void Button1_Click(object sender, EventArgs e)  

    {  

        Response.Write("成功调用后台方法!");  

    }  

}  

 
 
这样就可以成功通过前台调用后台的方法。这只是一个简单的举例,更复杂的应用与此相似。
 
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: