formatting a textbox with a specific format

hello,

i have a sort of validation that i need to implement in my form.

there are textboxes that should accept only numbers. as the user types the appropriate commas should appear accordingly.

example: the user types 25000 but in the text box it appears as 25,000 automatically.

i dont want the user to input points as there wont be any decimals in the values. he/she should only input the number.

could i get some help on it with javascript?

peace,
fmh002
fmh002Asked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

rdmjrbCommented:
Basically you would have a function that gets fired onKeyPress that firstly checks the user only types numbers and second checks the length and if the length is 3/6/9, etc then it sticks a ',' in the string.

This is a pretty complicated piece of javascript for only 30 points, however this is one of the best javascript sites I have come across: http://www.dynamicdrive.com that may help your cause.
0
jaysolomonCommented:
<html>
<head>
<title></title>
<script type="text/javascript">
<!--
function formatZip(objFormField){
  intFieldLength = objFormField.value.length;
  if(intFieldLength==2){
       objFormField.value = objFormField.value + ",";
            return false;
  }
}
//-->
</script>
</head>
<body>
<form name="form1" method="post" action="">
  <input type="text" name="zip" onKeyPress="formatZip(this)" maxlength="6">
</form>
</body>
</html>
0
jaysolomonCommented:
disregard the function name

<script type="text/javascript">
<!--
function formatField(objFormField){
  intFieldLength = objFormField.value.length;
  if(intFieldLength==2){
       objFormField.value = objFormField.value + ",";
            return false;
  }
}
//-->
</script>
0
Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

jaysolomonCommented:
 <input type="text" name="zip" onKeyPress="formatField(this)" maxlength="6">
0
jaysolomonCommented:
oooppppssss

  <input type="text" name="numField" onKeyPress="formatField(this)" maxlength="6">
0
fmh002Author Commented:
thnx for the link rdmjrb, i would have given it 60 points but im out of points right now.

jaysolomon!!! sup? i see you got what i wanted. your script works fine with maxlength=6. in my environment it is a bit difficukt coz the digits always exceed the max length=6. i live in a country where a dollar costs a 1000 shillings.

i would like to go to a maximum of 9. could you help me with the commas? it's working fine right now coz in my question i gave a 6 digit example. i see my mistake.

thnx once again jaysolomon

fmh002
0
fmh002Author Commented:
i've also noticed that if i type in 2500 it gives it a comma as well -> 25,00... ooops.
0
fmh002Author Commented:
i'd also like have only numbers entered. at the moment there is no restriction on the input in your script.

peace,
fmh002
0
jaysolomonCommented:
here is a link that may be very helpful.

Try it out and if you still need help just let me know. I will continue to write a shorter script.

jAy
0
jaysolomonCommented:
sh!t i forgot the link brb....
0
jaysolomonCommented:
http://www.mredkj.com/javascript/numberFormat.html#tryit

there is the link

after you look at that and if you decide to go that route, we can then see your form and create the Number Only function
0
fmh002Author Commented:
sup jaysolomon

wow that script on that page is quite complex and trying to customize it for my form is way beyond my capabilities. but there's a setback, that try it button does the formatting. i am sure there must be a way to make that function trigger onkeypress or something? dont you think so? well, i have decided to go that route but that button shouldn't do the function, it should be done on the textbox itself.

peace
fmh002
0
fmh002Author Commented:
that script has many functions, could you make it shorter? do only the comma placements
0
fmh002Author Commented:
people i need help, i've increased points for that matter...

peace
fmh002
0
jaysolomonCommented:
is this going to be a currency format, or do you just want a comma

also is it always 5 numbers or what is the max amount of numbers
0
fmh002Author Commented:
i just want a comm and my max amount of numbers could be 9,999,999
0
jaysolomonCommented:
try this

<html>
<head>
<title></title>
<script type="text/javascript">
<!--
function addCommas() {
var x = document.forms[0];
var objRegExp  = new RegExp('(-?[0-9]+)([0-9]{3})');
    while(objRegExp.test(x.fieldName.value)) {
       x.fieldName.value = x.fieldName.value.replace(objRegExp, '$1,$2');
    }
}
//-->
</script>
</head>

<body>
<form name="form1" method="post" action="">
  <input type="text" name="fieldName" onChange="return addCommas();">
  <input type="text" name="textfield">
</form>
</body>
</html>
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
jaysolomonCommented:
i tried using onKeyPress, but it got screwed up
0
fmh002Author Commented:
thnx jaysolomon,

now i can atleast say that look, the commas do appear!

thnx man,
fmh002
0
jaysolomonCommented:
Uh why the grade of a "C"?

You asked for commas, thats what you got
0
fmh002Author Commented:
hey man im sorry for grading a C on that. i'd make it up to you if you could help me with some other problem i got.
0
jaysolomonCommented:
you can post a Question in Community Support asking them to change this grade.

Now whats the Problem?
0
fmh002Author Commented:
0
jaysolomonCommented:
Response.Write "<SELECT name=studentid onchange=""studentname.value = this.value;"">"


I think it should be like so

Response.Write "<SELECT name=studentid onchange='this.form.studentname.value = this.value;'>"

and

Response.Write "<SELECT name=studentname onchange='this.form.studentid.value = this.value;'>"


This is contredicting itself to me

and this is why you are getting the same results in the 2 DB fields
0
fmh002Author Commented:
i have already posted on the community support, jay am i ok with u now?
0
jaysolomonCommented:
no problem man

BTW, i don't know how the mods or admins will act when they  see the link to the other forum, so wait and see.

Did you understand the post about the problem
0
fmh002Author Commented:
i tried changing the code to the one you gave and it's still posting the same value (studentid) to both of the fields
0
fmh002Author Commented:
i am trying what that mohecan guy suggested, let me c if that works
0
YensidModCommented:
Grade will be changed from C to A per fmh002 request.

YensidMod
EE Moderator
0
jaysolomonCommented:
:>)

thanks
0
fmh002Author Commented:
jay it's working now. i tried chaging the code to what mohecan suggested and the posting's fine now.

im sorry for the points thing man. thnx
0
jaysolomonCommented:
No problem

Happy Programming
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Web Development

From novice to tech pro — start learning today.