用JavaScript回发ASP.NET

我有几个小div使用jQuery拖动。 这些div放在UpdatePanel ,在dragstop上使用_doPostBack() JavaScript函数。 在那里我从页面表格中提取必要的信息。

我的问题是,当我调用这个函数整个页面被重新加载,但我只想要更新面板被重新加载。

这是一个完整的解决scheme

asp.net页面的整个表单标签

 <form id="form1" runat="server"> <asp:LinkButton ID="LinkButton1" runat="server" /> <%-- included to force __doPostBack javascript function to be rendered --%> <input type="button" id="Button45" name="Button45" onclick="javascript:__doPostBack('ButtonA','')" value="clicking this will run ButtonA.Click Event Handler" /><br /><br /> <input type="button" id="Button46" name="Button46" onclick="javascript:__doPostBack('ButtonB','')" value="clicking this will run ButtonB.Click Event Handler" /><br /><br /> <asp:Button runat="server" ID="ButtonA" ClientIDMode="Static" Text="ButtonA" /><br /><br /> <asp:Button runat="server" ID="ButtonB" ClientIDMode="Static" Text="ButtonB" /> </form> 

整个页面的代码隐藏类的内容

 Private Sub ButtonA_Click(sender As Object, e As System.EventArgs) Handles ButtonA.Click Response.Write("You ran the ButtonA click event") End Sub Private Sub ButtonB_Click(sender As Object, e As System.EventArgs) Handles ButtonB.Click Response.Write("You ran the ButtonB click event") End Sub 
  • 包含LinkBut​​ton以确保将__doPostBack javascript函数呈现给客户端。 只要有Button控件就不会导致这个__doPostBack函数被渲染。 这个函数将通过在大多数ASP.NET页面上具有各种控件来呈现,所以通常不需要空的链接button

这是怎么回事?

两个input控件呈现给客户端:

 <input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" /> <input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" /> 
  • __EVENTTARGET接收__doPostBack的参数1
  • __EVENTARGUMENT收到__doPostBack的参数2

__doPostBack函数如下所示:

 function __doPostBack(eventTarget, eventArgument) { if (!theForm.onsubmit || (theForm.onsubmit() != false)) { theForm.__EVENTTARGET.value = eventTarget; theForm.__EVENTARGUMENT.value = eventArgument; theForm.submit(); } } 
  • 如您所见,它将值分配给隐藏的input。

当表单提交/回传发生时:

  • 如果您提供了要运行button单击处理程序的服务器控件button的UniqueID( javascript:__doPostBack('ButtonB','') ,则会运行该button的button单击处理程序。

如果我不想运行一个点击处理程序,但想要做其他事情呢?

您可以将任何您想要的parameter passing给__doPostBack

然后,您可以分析隐藏的input值并相应地运行特定的代码:

 If Request.Form("__EVENTTARGET") = "DoSomethingElse" Then Response.Write("Do Something else") End If 

其他说明

  • 如果我不知道我要运行点击处理程序的控件的ID是什么?
    • 如果设置ClientIDMode="Static"是不可接受的,那么你可以这样做: __doPostBack('<%= myclientid.UniqueID %>', '')
    • 或者: __doPostBack('<%= MYBUTTON.UniqueID %>','')
    • 这将注入控制的唯一id到javascript中,如果你希望的话

每个Phairoh:在页面/组件中使用这个,以防面板名称改变

 <script type="text/javascript"> <!-- //must be global to be called by ExternalInterface function JSFunction() { __doPostBack('<%= myUpdatePanel.ClientID %>', ''); } --> </script> 

虽然Phairoh的解决scheme看起来理论上合理,但我也find了另一个解决这个问题的方法。 通过将UpdatePanels ID作为参数(事件目标)传递给doPostBack函数,更新面板将回发,但不是整个页面。

 __doPostBack('myUpdatePanelId','') 

*注意:第二个参数是添加事件参数

希望这可以帮助别人!

编辑:所以它似乎同样的一块build议是上面给出,因为我打字:)

如果任何人有麻烦(因为我是),你可以通过添加UseSubmitBehavior =“false”属性来获得一个button的回发代码。 如果你检查button的呈现源,你会看到你需要执行的确切的JavaScript。 在我的情况下,它使用的是button的名称,而不是id。

您是否尝试将更新面板的客户端ID传递给__doPostBack函数? 我的团队已经完成了刷新更新面板,据我所知,它的工作。

 __doPostBack(UpdatePanelClientID, '**Some String**'); 

您不能调用_doPostBack()因为它强制表单的子级。 为什么不在UpdatePanel上禁用PostBack

首先,不要使用更新面板。 他们是微软为Web开发者创造的第二个最邪恶的东西。

其次,如果您必须使用更新面板,请尝试将UpdateMode属性设置为条件。 然后添加一个触发器到您添加到页面的Asp:Hidden控件。 将更改事件分配为触发器。 在您的dragstop事件中,更改隐藏的控件的值。

这是未经testing的,但理论听起来似乎…如果这不起作用,你可以尝试与asp:button相同的事情,只需设置display:none样式,并使用click事件,而不是更改事件。