Click here to Skip to main content
15,886,046 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
i have texbox inside tab panel and i want to count enter characters in textbox onkeypress. but javascript not working when textbox are inside the tab panel.

What I have tried:

here is my code:

  <script type="text/javascript">
function countChars(countfrom,displayto) {
  var len = document.getElementById(countfrom).value.length;
  document.getElementById(displayto).innerHTML = len;
}
    </script>


<ajax:TabContainer ID="TabContainer1" runat="server" CssClass="ajax__tab_red-theme"
                   Width="100%" ActiveTabIndex="0">
                   <ajax:TabPanel ID="tbpnlPhotos" runat="server">
                       <HeaderTemplate>
                           class="fa fa-comment"> Student
                       </HeaderTemplate>
                       <ContentTemplate>

  <table width="100%">
                            <tr>
                       <td align="right" style="font-size: small">
                           <span id="charcount" style="color:red">0</span> characters entered.
                       </td>
                       </tr>
                           <tr>
                           <td align="center">
                             <asp:TextBox ID="txtMessage" onkeyup="countChars('txtMessage','charcount');" onkeydown="countChars('txtMessage','charcount');"
                               onmouseout="countChars('txtMessage','charcount');" runat="server" Width="95%"
                               placeholder="Message........" TextMode="MultiLine" Height="220px" MaxLength="2"
                               BorderColor="Blue"></asp:TextBox>
                           </td>
                           </tr>
                           </table>

                           <br />
                           <br />
                       </ContentTemplate>
                   </ajax:TabPanel>
  </ajax:TabContainer>
Posted
Updated 6-Nov-17 22:46pm
Comments
Karthik_Mahalingam 7-Nov-17 4:43am    
are you getting any error in console window?
TCS54321 7-Nov-17 4:46am    
no.. if i paste textbox outside the TabContainer then its working fine but not inside.
Karthik_Mahalingam 7-Nov-17 4:47am    
check the solution.
TCS54321 7-Nov-17 4:50am    
its working. thank you karthik.
Karthik_Mahalingam 7-Nov-17 4:51am    
welcome.

1 solution

try

<span id="charcount" style="color:red">0</span> characters entered.
      <asp:TextBox ID="txtMessage" onkeyup="countChars();" onkeydown="countChars();"
                             onmouseout="countChars();" runat="server" Width="95%"
                             placeholder="Message........" TextMode="MultiLine" Height="220px" MaxLength="2"
                             BorderColor="Blue"></asp:TextBox>


function countChars() {
          var textBoxClientID = '<%= txtMessage.ClientID%>'
          var len = document.getElementById(textBoxClientID).value.length;
          document.getElementById('charcount').innerHTML = len;
      }
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900