如何覆盖由 Asp.Net UpdatePanel (动态)添加的 Javascript 函数?

2024-04-27

我遇到了一些麻烦,我只能想象是 Javascript 范围问题以及 Microsoft Asp.Net 客户端框架。

由于上述原因这个问题 https://stackoverflow.com/questions/18862565/what-is-the-correct-approach-to-localize-asp-net-webforms-validators我需要覆盖 javascript 函数 ValidatorConvert,该函数由 Asp.Net 的 ScriptResource.axd 提供服务并由其 Validator 服务器控件使用。

首先,我将介绍如何使代码工作。然后我将展示一个我无法使其工作的场景。

这是一个带有验证器控件的简单 Asp.Net WebForm:

<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函数,它将被我的覆盖。

现在,这是一个不起作用的场景。这是一个略有不同的 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 完成。

现在,当呈现表单时,验证器控件默认不可见。因此,指向 javascript 文件 (ScriptResource.axd) 的链接根本不会放置在页面上!

但是,当按下按钮并且验证器可见时,链接将被动态添加。

问题是,这个链接是由asp.net框架放置在head标签中的。

即使我的函数仍然按层次结构定义在原始函数之下,我的函数也不会被调用。

我尝试将我的函数放在不同的地方,包括 head 标签,但它似乎也不起作用。看起来最后定义的函数被认为是有效的。

那么,我该如何覆盖第二种情况下的函数呢?此外,是否有一个解决方案可以同时适用于这两种情况?

预先感谢您抽出时间。


感谢尤里的意见,我能够想出一个解决方案。

基本上,我创建的代码将在页面首次加载时定义我的函数。另外,我注册了自定义函数,以便在每次 ajax 请求后重新定义我的函数。鉴于我将此代码放在 MasterPage 上,我能够使其在所有应用程序中工作。

这是代码:

MasterPage.aspx 是一个简单的 Html 页面,其 ContentPlaceHolders 和 ScriptManager 位于表单标记的正下方。另外,我必须在页面顶部(head 标签)放置对“Utils.js”的引用。

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 的页面。该代码将不断地用我的代码覆盖验证函数。有一点开销,但我想不出其他方法。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何覆盖由 Asp.Net UpdatePanel (动态)添加的 Javascript 函数? 的相关文章