Question

我想知道如何从TextBox中读取值并在按钮单击时分配给另一个TextBox。此TextBox附加到AJAX CalendarExtender。到目前为止，我有这个。我需要在Javascript中使用ShowDate（）函数。

  <asp:TextBox ID="txtStartDate" runat="server"  ReadOnly="false" Height="28px"    Width="283px"></asp:TextBox>
    <asp:CalendarExtender  ID="ClendarExtender" BehaviorID="CE1"   TargetControlID="txtStartDate" runat="server">
    </asp:CalendarExtender>

    <br />
    <asp:TextBox ID="txtShowMessage" runat="server" Height="76px" 
        style="margin-left: 336px" Width="306px"></asp:TextBox>
    <br />
    <br />
    <asp:Button ID="btnCreateNote" runat="server"  OnClientClick="showDate()"  style="margin-left: 456px" 
        Text="Button" onclick="btnCreateNote_Click" />
    <br />

然后我的js是

 function showDate() {
 var txtDate = document.getElementById('<%=txtStartDate.ClientID  %>');
 document.getElementById("txtShowMessage").value = txtDate;
 }

不知道什么是错的，textDate中没有值。

Answer 1

尝试更改您的Javascript showDate()方法，例如

<script type="text/javascript" >
        function showDate() {
            var txtDate = document.getElementById('txtStartDate').value;
            document.getElementById('txtShowMessage').value = txtDate;
        }

</script>

我检查了这个功能，它运行正常，希望它适合你。

Answer 2

这是因为当您编写runat="server"时，ASP引擎会在其前面添加一些字符串。 ASP.NET有一个内置机制（INamingContainer），以确保您没有多个名为相同的控件。它通过添加容器前缀来实现此目的。

所以

<asp:TextBox ID="txtShowMessage" runat="server"></asp:TextBox>

会改为

<input type="text" id="ctl00_ctl00_txtShowMessage" runat="server" />

所以只有document.getElementById('txtShowMessage')无效。您需要获得完整的ID。所以你可以使用document.queryselector('[id$=txtShowMessage]')。这意味着获取ID以txtShowMessage结尾的元素否则你可以这样做

document.getElementById('<%=txtShowMessage.ClientID  %>');

注意
1.我提到的第二种方法更好（使用ClientID） 2.如果您想知道完整的ID，请转到网页查看其来源，找到该TextField并检查ID（它不会每次都改变，那就是固定的）
3.有关更多信息，请参阅here

使用javascript从文本框中获取AJAX CalendarExtender值

2 个答案: