不能通过外部页面上的javascript访问User-Control

Can't access User-Control via javascript on the outer Page

本文关键字:javascript 访问 User-Control 外部 不能      更新时间:2023-09-26

我用labeltextbox开发了我的用户控件(它们都来自DevExpress)。我有一个页面与一些控制,包括我和javascript块。我意识到我必须使用document.getElementById("<%=tbPosition.ClientID %>")获取访问权限,实现用户控制。但是document.getElementById("<%=tbPosition.ClientID %>")返回null

下面是我的代码:1) Page.aspx与用户控制
<script type="text/javascript" language="javascript">
    var tb = document.getElementById("<%=tbPosition.ClientID %>"); // returns null
</script>
<head></head>
<body>
    <rsoft:TextBoxControl ID="tbPosition" runat="server" 
      Title="Позиция" IsRequired="true" 
      ValidationMode="UnsignedInt" ClientIDMode="Static" />
</body>

2) User-control 'rsoft:TextBoxControl'

<table>
<tr>
    <td class="styleFieldLabel">
        <asp:Label ID="lblTitle" Text="" runat="server" Font-Bold="True" />
        &nbsp;
    </td>
    <td class="styleFieldInput">
        <dx:ASPxTextBox ID="tbValue" runat="server" Width="500px"
            ClientIDMode="Static" ClientInstanceName="tbValue">   
        <ClientSideEvents TextChanged="tbValue_TextChanged" />                     
            <ValidationSettings SetFocusOnError="True" Display="Dynamic" RequiredField-ErrorText="Поле обязательно для заполнения" 
                ErrorTextPosition="Bottom" ValidateOnLeave="false" />                
        </dx:ASPxTextBox>            
    </td>
</tr>

有没有人知道为什么document.getElementById("<%=tbPosition.TextBoxClientID %>")变成document.getElementById("tbPosition_tbValue"),但有一个html元素"tbPosition_tbValue_I"不是"tbPosition_tbValue"?当我在我的用户控件内使用DevExpress控件时,就会发生这种情况。当我的控件不包含devexpress,但通常的<Asp:Textbox>我没有这个问题。

. NET加载UserControl时,它只呈现UserControl的内容。

在你的例子中,它会渲染<table>,行,单元格,这些的内容。它会把document.getElementById("<%=tbPosition.ClientID %>")变成document.getElementById("tbPosition"),因为这是你在运行时告诉它要做的,但是tbPosition在渲染为html时什么都不是。

你的选择是:要么在UserControl中编写javascript来访问这些控件,要么将你的服务器控件设置为ClientIDMode="Static",这将确保你可以将正确的id的控件放入你的javascript。

var tb = document.getElementById('tbValue');

您需要在知道整个初始DOM之后调用document.getElementById

window.onload = function () {
  var tb = document.getElementById(...);
};