unable to set asp.net textbox value in javascript

Question

I'm trying to create a simple counter box next to an ASP.NET multi-line textbox. I'm using JavaScript to do this ClientSide.

 <script type="text/javascript">

       function textCounter(maxlimit) {

           var txtField = document.getElementById('<%=txtWhatCompanyDoes.ClientId%>')

           var cntCounter = document.getElementById('<%=txtWhatCompDoesChrsRem%>')

           if (txtField.value.length > maxlimit) {

               txtField.value = txtField.value.substring(0, maxlimit);
           }
           else
           {
               var chrsleft = maxlimit - txtField.value.length;
               cntCounter.value = chrsleft;

           }
       }
    </script>

My page code is;

<asp:TextBox ID="txtWhatCompanyDoes" onKeyUp="textCounter('txtWhatCompanyDoes', 'txtWhatCompDoesChrsRem',2000);" runat="server" TextMode="MultiLine" Rows="10"></asp:TextBox>
                <asp:TextBox ID="txtWhatCompDoesChrsRem" runat="server"></asp:TextBox>

The problem is that it works right up to the last line of the JavaScript as I can use an alert to tell me the number of characters left, but's just not writing the value to the textbox. Am I doing something wrong?

from the code you showed you are not calling client ID on txtWhatompDoesChrsRem — QBM5
– QBM5, Commented Aug 20, 2014 at 18:51

QBM5 · Accepted Answer · 2014-08-20 18:51:58Z

1

Try adding client id on line 4 at the end of txtWhatCompDoesChrsRem

       function textCounter(maxlimit) {

           var txtField = document.getElementById('<%=txtWhatCompanyDoes.ClientId%>')

           var cntCounter = document.getElementById('<%=txtWhatCompDoesChrsRem.ClientId%>')

           if (txtField.value.length > maxlimit) {

               txtField.value = txtField.value.substring(0, maxlimit);
           }
           else
           {
               var chrsleft = maxlimit - txtField.value.length;
               cntCounter.value = chrsleft;

           }
       }
    </script>

answered Aug 20, 2014 at 18:51

QBM5

2,7882 gold badges19 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Alastair W · Accepted Answer · 2014-08-20 20:28:59Z

Wow, how emabarassing. I can't believe I missed that. Can I be cheeky and ask how this can be made dynamic for multiple counter boxes on one page e.g.

<script type="text/javascript">

   function textCounter(field, cntField, maxlimit) {

       var txtField = document.getElementById(field)

       var cntCounter = document.getElementById('<%=txtWhatCompDoesChrsRem.Clientid%>')

       if (txtField.value.length > maxlimit) {

          txtField.value = txtField.value.substring(0, maxlimit);
       }
       else
       {
          var chrsleft = maxlimit - txtField.value.length;

          cntCounter.value = chrsleft;

       }
    }
    </script>




<asp:TextBox ID="txtWhatCompanyDoes" onKeyUp="textCounter(this.id, txtWhatCompDoesChrsRem',2000);" runat="server" TextMode="MultiLine" Rows="10"></asp:TextBox>
    <asp:TextBox ID="txtWhatCompDoesChrsRem" runat="server"></asp:TextBox>

I can pass the first control id using "this.id" but how can I pass the counter box as a variable?

Alastair W · Accepted Answer · 2014-08-20 20:49:47Z

0

This only way I could solve this was to set the counter box as an rather than an ASP textbox.

<asp:TextBox ID="txtWhatCompanyDoes" onKeyUp="textCounter(this.id, this.form.txtWhatCompDoesChrsRem, 2000);" runat="server" TextMode="MultiLine" Rows="10"></asp:TextBox>
 <input name="txtWhatCompDoesChrsRem" type="text" value="2000" />

answered Aug 20, 2014 at 20:49

Alastair W

1012 silver badges12 bronze badges

Comments

user2116780 · Accepted Answer · 2014-08-20 21:55:16Z

0

every element in asp.net have inherit id like "txtWhatCompDoesChrsRem.Clientid"

so when u want to use some element in java script u can simply add one line to the element :

<asp:TextBox id="txt1" ClientID="static" ...

thats mean u can use the element directly by his name

java script :

var txtField = document.getElementById("txt1")

answered Aug 20, 2014 at 21:55

user2116780

Collectives™ on Stack Overflow

unable to set asp.net textbox value in javascript

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related