Почему мой JavaScript не взаимодействует с моим UserControl?

Question

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl.ascx.cs" Inherits="WebUserControl" %> 

<script type="text/javascript"> 
    function Incrementer() { 
     var txtBox = document.getElementById('MainContent_TextBox1').value; 

     var i = parseInt(txtBox); 
     i = i + 1; 
     var v = i + ""; 
     document.getElementById('MainContent_TextBox1').value = v; 
     return false; 
    } 
    function Decrementer() { 
     var txtBox = document.getElementById('MainContent_TextBox1').value; 

     var i = parseInt(txtBox); 
     i = i - 1; 
     var v = i + ""; 
     document.getElementById('MainContent_TextBox1').value = v; 
     return false; 
    } 

</script> 
<asp:TextBox ID="TextBox1" runat="server" Text="0"></asp:TextBox><br /> 
<asp:Button ID="Button1" runat="server" Text="Up" OnClientClick="return Incrementer();"/> 
<asp:Button ID="Button2" Text="Down" runat="server" OnClientClick="return Decrementer();"/> 

Default.aspx следующим образом: -

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" 
    CodeFile="Default.aspx.cs" Inherits="_Default" %> 
    <%@ Register Src="~/WebUserControl.ascx" TagName="IncrementerUserControl" TagPrefix="uc1" %> 
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent"> 
</asp:Content> 
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent"> 

<uc1:IncrementerUserControl ID="Incrementer1" runat="server"/> 
    </asp:Content> 

Функция инкрементора сейчас не работает, когда он у меня включен в UserControl. Зачем? Если я использую инкремент и декрементер без пользовательского контроля, он работает нормально.

Answer 1

MainContent_TextBox1 есть проблема. Когда вы включаете TextBox в элементе управления пользователя, его имя получает искажаются из-за runat=server

Попробуйте использовать: document.getElementById('%=TextBox1.ClientID %')

Смотрите:

http://jagregory.com/writings/how-to-use-clientids-in-javascript-without-the-ugliness/