使用 JavaScript 的 ASP.NET 回发

问题描述:

我有几个小的 div 使用 jQuery 可拖动.这些 div 被放置在一个 UpdatePanel 中,并且在 dragstop 上我使用 _doPostBack() JavaScript 函数,在那里我从页面的信息中提取必要的信息形式.

I have several small divs which are utilizing jQuery draggable. These divs are placed in an UpdatePanel, and on dragstop I use the _doPostBack() JavaScript function, where I extract necessary information from the page's form.

我的问题是,当我调用这个函数时,整个页面都会重新加载,但我只想重新加载更新面板.

My problem is that when I call this function, the whole page is re-loaded, but I only want the update panel to be re-loaded.

这里有一个完整的解决方案

<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 页面上具有各种控件,因此将呈现此功能,因此通常不需要空链接按钮
  • 向客户端呈现两个输入控件:

    Two input controls are rendered to the client:

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

  • __EVENTTARGET 接收 __doPostBack 的参数 1
  • __EVENTARGUMENT 接收 __doPostBack 的参数 2
    • __EVENTTARGET receives argument 1 of __doPostBack
    • __EVENTARGUMENT receives argument 2 of __doPostBack
    • __doPostBack 函数是这样渲染的:

      The __doPostBack function is rendered out like this:

function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}

  • 如您所见,它将值分配给隐藏的输入.
  • 当表单提交/回发时:

    • 如果您提供了要运行其按钮单击处理程序的服务器控制按钮的 UniqueID (javascript:__doPostBack('ButtonB',''),则按钮单击处理程序用于该按钮将被运行.
    • If you provided the UniqueID of the Server-Control Button whose button-click-handler you want to run (javascript:__doPostBack('ButtonB',''), then the button click handler for that button will be run.

    你可以将任何你想要的作为参数传递给 __doPostBack

    You can pass whatever you want as arguments to __doPostBack

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

    You can then analyze the hidden input values and run specific code accordingly:

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

其他注意事项

  • 如果我不知道要运行其单击处理程序的控件的 ID,该怎么办?
    • 如果设置 ClientIDMode="Static" 是不可接受的,那么您可以执行以下操作:__doPostBack('<%= myclientid.UniqueID %>', '').
    • 或者:__doPostBack('<%= MYBUTTON.UniqueID %>','')
    • 如果您愿意,这会将控件的唯一 ID 注入到 javascript 中
    • Other Notes

      • What if I don't know the ID of the control whose click handler I want to run?
        • If it is not acceptable to set ClientIDMode="Static", then you can do something like this: __doPostBack('<%= myclientid.UniqueID %>', '').
        • Or: __doPostBack('<%= MYBUTTON.UniqueID %>','')
        • This will inject the unique id of the control into the javascript, should you wish it