Updating character count as user types each character

  • Thread starter Thread starter refer_to_website
  • Start date Start date
R

refer_to_website

My VB.NET web application has a textbox where the user is allowed to
enter up to 50 characters. I have a label on the form next to the
textbox that tells the user how many remaining characters he can
enter. This label needs to be refreshed on the fly each time the user
types a character into the text box.

Eventually, the user will click the SAVE button on the web form, and
the data he entered in the text box will be written to the database.

1. How can I get the label to refresh each time the user types a
character? I know I need JavaScript to accomplish this, but the
examples I tried do not work.

2. How can I get the server side code-behind (aspx.vb file) to read
the value of the client-side JavaScript textbox so that I can write
its value to the database?

Thanks for your help.
 
Cor said:
And than maybe you can use a server side control, so the other
questions about the javascript disapear.
Click to expand...

You don't want to have to do a server roundtrip on every key press for
something as simple as this.
--
Tom Porterfield
MS-MVP MCE
http://support.telop.org

Please post all follow-ups to the newsgroup only.
 
My VB.NET web application has a textbox where the user is allowed to
enter up to 50 characters. I have a label on the form next to the
textbox that tells the user how many remaining characters he can
enter. This label needs to be refreshed on the fly each time the user
types a character into the text box.

Eventually, the user will click the SAVE button on the web form, and
the data he entered in the text box will be written to the database.

1. How can I get the label to refresh each time the user types a
character? I know I need JavaScript to accomplish this, but the
examples I tried do not work.
Click to expand...

Take a look at this piece of HTML:

<HTML>
<HEAD>
<SCRIPT LANGUAGE="javascript">
function setRemainingChars()
{
remainingChars.innerText=myInput.maxLength-myInput.value.length;
}
</SCRIPT>
</HEAD>
<BODY ONLOAD="javascript:remainingChars.innerText=myInput.maxLength;">
<INPUT TYPE="TEXT" MAXLENGTH=50 ID="myInput"
ONKEYUP="setRemainingChars();"></INPUT>
<SPAN ID="remainingChars"></SPAN>
</BODY>
2. How can I get the server side code-behind (aspx.vb file) to read
the value of the client-side JavaScript textbox so that I can write
its value to the database?
Click to expand...

Place it in the form tag that gets posted back to the server. If you want
to access using a server side object then specify for the control to runat
server.
--
Tom Porterfield
MS-MVP MCE
http://support.telop.org

Please post all follow-ups to the newsgroup only.
 
Cor said:
Did I say that,

Have a look at this

http://www.microsoft.com/downloads/...A6-3647-4070-9F41-A333C6B9181D&displaylang=en

Validating.

And take a dotnet approach.
Click to expand...

That link only takes me to the download for the .NET Framework 1.1 SDK, not
any documentation or recommendations. But if you want to update on the
screen with each and every key press you can't do that server side without
round trips between each key press. I'm not sure how you would accomplish
this with validation controls as they don't hook the the keyup/down/press
events AFAIK.
--
Tom Porterfield
MS-MVP MCE
http://support.telop.org

Please post all follow-ups to the newsgroup only.
 
Maybe,

But I did not say take a roundtrip, you can also do something as this.
\\\
Private Sub Page_Load(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles MyBase.Load
Me.TextBox1.Attributes("onkeyup") = _
"javascript:Remaining();"
Dim scriptString As String = "<script language=JavaScript>" & _
"function Remaining(){" & _
"if (document.all('Textbox1').value.length <51) { " & _
"document.all('label').innerText=50-document.all " & _
"('Textbox1').value.length;}" & _
"else {document.all('Textbox1').value = " & _
"document.all('Textbox1').value.substring(0,50) }}" & _
"</script>"
RegisterStartupScript("Startup", scriptString)
End Sub
//
And still use the serverside controls (I used a HTML label because that does
nothing).

I did a time not use the validating (and I am lazy so probably I would do it
like this), but I think it is the best to tell the OP first to point to the
documentation.

But just my thougth,

Cor
 
Cor said:
Maybe,

But I did not say take a roundtrip, you can also do something as this.
\\\
Private Sub Page_Load(ByVal sender As System.Object, _
ByVal e As System.EventArgs) Handles MyBase.Load
Me.TextBox1.Attributes("onkeyup") = _
"javascript:Remaining();"
Dim scriptString As String = "<script language=JavaScript>" &
_ "function Remaining(){" & _
"if (document.all('Textbox1').value.length <51) { " & _
"document.all('label').innerText=50-document.all " & _
"('Textbox1').value.length;}" & _
"else {document.all('Textbox1').value = " & _
"document.all('Textbox1').value.substring(0,50) }}" & _
"</script>"
RegisterStartupScript("Startup", scriptString)
End Sub
//
And still use the serverside controls (I used a HTML label because
that does nothing).
Click to expand...

But all you're doing is writing the javascript out from the server rather
than placing it directly in the HTML. This can be beneficial if the
javascript code might change based on some other variables that are only
known server side. For static client-side script that doesn't change this
can be hard to maintain and cause a small amount of unnecessary server
execution on every page load event, the end result being you are still just
executing client side javascript to update the value on the screen, making
your comment about a .NET solution making javascript questions disappear not
accurate. Even .NET validation controls just use javascript clientside for
client-side validation and it's important to understand how that works
before relying on it too much to do these types of things that are generally
outside of typical validation that is done with validation controls.
I did a time not use the validating (and I am lazy so probably I
would do it like this), but I think it is the best to tell the OP
first to point to the documentation.
Click to expand...


I agree, but you are linking to the Framework SDK, not any specific
documentation relevant to the original question.
--
Tom Porterfield
MS-MVP MCE
http://support.telop.org

Please post all follow-ups to the newsgroup only.
 
Hi Tom,

No I use a serverside textbox control.

That is the big difference.

(And keep the program code isolated in the aspx.vb page yes, but that is not
the big difference, I did also some extra checking to prevent that it where
more than 50 characters also not important.)

Cor
 
Thanks for all your responses. I downloaded the .NET SDK and will
check there first from now on.

The code sample that Cor posted works great!
 
Back
Top