将 aspx 页面转换为 WebUserControl

Question

我运行在将 ASPX 页面转换为控制器 (ASCX) 时遇到了问题。我的 JavaScript 没有在隐藏的 div 中找到文本框，也没有触发 onclick 事件。但是它在 ASPX 页面中工作得很好。

我的 JavaScript 是..

function FireEditClickButton() {
        document.getElementById("btnFireEdit").click();
    }

它应该触发这个隐藏的按钮 div 以及下一个）

<asp:Button ID="btnFireEdit" runat="server" OnClick="btnFireEdit_Click" />

然后用这个JavaScript

function GetSelection() {
        var c = document.getElementById("tbRA");
        c.innerText = checkListBox.GetSelectedValues();
        UpdateText();
    }

每次检查列表框有值时都会被调用。

两个错误都说它们是空的，但它们就在隐藏的 div

中

<div style="visibility: hidden">
        <asp:TextBox ID="tbRA" runat="server"></asp:TextBox>
        <asp:Button ID="btnFireEdit" runat="server" OnClick="btnFireEdit_Click" />
    </div>

为什么会发生这种情况，因为它在 ASPX 页面中完全可以正常工作？是否与 WebUserControl 不使用表单标签有关？

谢谢

Answer 1

当使用嵌套控件（或母版页中嵌套的页面）时，默认情况下客户端的 ID 将与服务器端的不同。 ASP.NET 默认执行此操作以帮助确保客户端上的所有 ID 都是唯一的。但是，您可以使用以下两种方法之一来防止这种情况。

第一个选项是将 ClientIDMode 更改为静态。您可以在控件、页面、web.config 或 machine.config 级别执行此操作。 web.config 技术如下所示。客户端上的 ID 将与服务器上的 ID 匹配。

<configuration>
    <system.web>
        <pages clientIDMode="static" />
    </system.Web>
</configuration>

第二个选项是使用内联 C# 代码将 ID 嵌入到您的 JavaScript 中，但这仅在 JavaScript 嵌入到 ASP.NET 页面或控件中时有效，并且不在单独的脚本文件中。将评估 C# 表达式，因此客户端上的 ID 将嵌入到 JavaScript.

document.getElementById('<%= btnFireEdit.ClientId %>');

还有第三种选择，那就是弄清楚客户端上的 ID 是什么，然后手动将其放入 JavaScript，如下所示：

document.getElementById("myctrlname_btnFireEdit").click();

但是，这是一个 糟糕的 想法。如果您曾经重命名 myctrlname 或 btnFireEdit，那么您的客户端代码将在运行时失败。编译时失败总比运行时失败好。

Answer 2

您的 javascript 找不到按钮，因为在呈现的 HTML 中它不再有 id="btnFireEdit" 而是一个基于用户控件名称的 ID（例如 id="myctrlname_btnFireEdit").

您有两个选择...要么更新 javascript 以包含用户控件的名称...

document.getElementById("myctrlname_btnFireEdit").click();
document.getElementById("<%=btnFireEdit.ClientID%>").click();

（请注意，这两行中的第二行仅在 javascript 是用户控件本身的一部分时才有效。如果 javascript 在外部 .js 文件或父页面）

或者使用 <asp:Button> 的 ClientIDMode 属性并将值设置为 Static。这将使呈现的 HTML 使用 id="btnFireEdit"...

<asp:Button ID="btnFireEdit" runat="server" OnClick="btnFireEdit_Click"
  ClientIDMode="Static" />

将 aspx 页面转换为 WebUserControl

Converting aspx page to WebUserControl

javascript

asp.net

webusercontrol