如何覆盖Asp.Net UpdatePanel添加的（动态）Javascript函数？ [英] How do I overwrite a Javascript function added (dynamically) by Asp.Net UpdatePanel?
问题描述
我遇到的问题是我只能想象一下Javascript范围问题以及Microsoft Asp.Net客户端框架。
I'm having a bit of trouble with what I can only imagine is a Javascript scope problem alongside with Microsoft Asp.Net client side framework.
因为此问题中陈述的原因我需要覆盖javascript函数ValidatorConvert，由Asp.Net的ScriptResource.axd提供服务并由其Validator服务器控件使用。
Because of the reasons stated on this question I need to overwrite the javascript function ValidatorConvert, served by Asp.Net's ScriptResource.axd and used by its Validator server controls.
首先，我将介绍如何使代码工作。然后我将展示一个我无法使其工作的场景。
First I will present how I can make the code work. Then I'll show a scenario where I can't make it work.
这是一个带有验证器控件的简单Asp.Net WebForm：
Here's a simple Asp.Net WebForm with a validator control:
<body>
<form id="form1" runat="server">
<script type="text/javascript">
function ValidatorConvert(op, dataType, val) {
//>>Overwrite ValidatorConvert function.
//>>Call to the original JS file will be below the form tag and above script tag
return op.toString(); //<<Consider everything as valid (client side)
}
</script>
<asp:ScriptManager runat="server"
ID="Scriptmanager1"
allowcustomerrorsredirect="true"
asyncpostbackerrormessage="Operation cannot be executed."
asyncpostbacktimeout="90"
enablepartialrendering="true"
enablescriptglobalization="true"
enablescriptlocalization="true"
supportspartialrendering="true"
scriptmode="Inherit"></asp:ScriptManager>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:CompareValidator
ID="CompareValidator1"
runat="server"
ErrorMessage="Ops, not an integer"
Operator="DataTypeCheck"
Type="Integer"
ControlToValidate="TextBox1"></asp:CompareValidator>
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
</form>
</body>
现在，当asp.net呈现表单时，它会以某种方式检测到有可见的验证器控件在页面上。因此，在表单下方和脚本标记正上方将向客户端JS调用验证器。这个JS文件将有一个ValidatorConvert函数，它将被我的覆盖。
Now, when asp.net renders the form, it will somehow detect that there is a validator control visible on the page. Because of that there will be a call to the client side JS for validators right below the form and right above my script tag. This JS file will have a ValidatorConvert function which will be overwritten by mine.
现在，这是一个不起作用的场景。这是一个略有不同的WebForm：
Now, here's a scenario where this won't work. Here's a slightly different WebForm:
<body>
<form id="form1" runat="server">
<asp:ScriptManager runat="server"
ID="Scriptmanager1"
allowcustomerrorsredirect="true"
asyncpostbackerrormessage="Operation cannot be executed."
asyncpostbacktimeout="90"
enablepartialrendering="true"
enablescriptglobalization="true"
enablescriptlocalization="true"
supportspartialrendering="true"
scriptmode="Inherit"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:MultiView ID="MultiView1" runat="server" ActiveViewIndex="0">
<asp:View ID="View1" runat="server">
<asp:Button ID="ButtonShowInput" runat="server" Text="Show Input Field" CausesValidation="false" OnClick="ButtonShowInput_Click" />
</asp:View>
<asp:View ID="View2" runat="server">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:CompareValidator
ID="CompareValidator1"
runat="server"
ErrorMessage="Ops, not an integer"
Operator="DataTypeCheck"
Type="Integer"
ControlToValidate="TextBox1"></asp:CompareValidator>
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
</asp:View>
</asp:MultiView>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
现在我在UpdatePanel中有一个MultiView。页面加载是第一个只有一个按钮时可见的视图。按下此按钮时，将显示带验证器控件的第二个视图。因为这是在UpdateUpdate中，所以这将使用AJAX完成。
Now I have a MultiView inside an UpdatePanel. The view visible when the page load is the first one with only a button. When this button is pressed, it will display the second view with the validator control. Because this is inside an UpdateUpdate, this will be done using AJAX.
现在，在呈现表单时，默认情况下验证器控件不可见。因此，javascript文件（ScriptResource.axd）的链接根本不会放在页面上！
Now, when the form is rendered the validator control is not visible by default. So, the link to the javascript file (ScriptResource.axd) will not be placed on the page at all!
但是当按下按钮并且验证器可见时，该链接将以dinamically方式添加。
But when the button is pressed and the validator is visible, the link will be added dinamically.
问题是，此链接由头标记中的asp.net框架放置。
The problem is, this link is placed by the asp.net framework in the head tag.
即使我的函数仍然在原始函数之下分层次定义，我的函数也不会被调用。
And even though my function is still defined hierarchically below the original one, my function is not called.
我尝试将函数放在不同的地方，包括头标记，但它似乎也不起作用。似乎它被认为是最后定义的函数有效。
I tried placing my function in different places, including the head tag, but it doesn't seem to work either. It seems like it is considered as valid the last defined function.
那么，如何在第二种情况下覆盖该函数？此外，是否有一个解决方案适用于这两种情况？
So, how can I overwrite the function on this second scenario? Furthermore, is there a single solution that will work for both scenarios?
提前感谢您抽出时间。
推荐答案
感谢Yuriy的意见，我能够提出解决方案。
Thanks to Yuriy's input, I was able to come up with a solution.
基本上，我创建的代码将定义页面首次加载时我的功能。此外，我注册了我的自定义函数，以在每次ajax请求后重新定义我的函数。鉴于我将此代码放在MasterPage上，我能够使其在所有应用程序中运行。
Basically, I created code that will define my function when the page first load. Also, I registered my custom function to redefine my function after every ajax request. Given that I put this code on a MasterPage I'm able to make it work across all the application.
以下是代码：
MasterPage.aspx是一个简单的Html页面，其ContentPlaceHolders和ScriptManager位于表单标签的正下方。另外，我必须在页面顶部（头标记）添加对Utils.js的引用。
MasterPage.aspx is a simple Html page with its ContentPlaceHolders and the ScriptManager right below the form tag. Also, I had to place a reference to my "Utils.js" at the top of the page (head tag).
MasterPage.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
if (!Page.ClientScript.IsStartupScriptRegistered("jsDefineFunction"))
Page.ClientScript.RegisterStartupScript(Page.GetType(), "jsDefineFunction", "defineValidationFunction();", true);
if (!Page.ClientScript.IsStartupScriptRegistered("jsDefineEndRequestFunction"))
Page.ClientScript.RegisterStartupScript(Page.GetType(), "jsDefineEndRequestFunction", "Sys.WebForms.PageRequestManager.getInstance().add_endRequest(defineValidationFunction);", true);
}
}
Utils.js
function defineValidationFunction() {
var ValidatorConvert = function (op, dataType, val) {
//>>Consider everything as valid (client side)
return op.toString();
}
}
有了这个，我的代码适用于所有页面使用MasterPage。代码将不断覆盖我的验证功能。有一点开销，但我想不出另一种方式。
With that in place, my code works for all pages that uses the MasterPage. The code will constantly overwrite the validation function with mine. There's a little bit of overhead but I couldn't figure out another way.
这篇关于如何覆盖Asp.Net UpdatePanel添加的（动态）Javascript函数？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
