dynamic text field

[dfred]

Good afternoon:
I am a cold fusion user who is looking to solve a text field issue. With our system the user may edit a comma delimited text string and add additional numbers seperated by commas to the end of the string. i am looking for a way to dynamically expand the text field by lets say 6 characters every time the users adds more characters then the text field will display. is there some js code that will do this dynamically?

Thanks for any help

dan

[Spookster]

You wouldn't be able to do this without reloading the page. With that being the case it would probably be better to stick with CF to rewrite the text field with a longer limit. Is there a reason you need to put a limit on the textfield in the first place?

[dfred]

darn, i was hoping this could be done. the reason i was wanted to dynamically resize the text field is that some of the text strings are only a few characters long and some are really long. By having a huge text field the page just looks odd and i wanted to make the page look much cleaner.
I guess I could find the length of the text field and add a certain amount of characters to the end thinking that the string may not get to long.

Thanks

dan

[Spookster]

I think we might be talking about two different things here. Are you referring to the physical width of the textbox or the maxlength (number of characters that can be typed in) of the textbox?

Now that I think of it you could do this with layers but you would have to rewrite the contents of the layer each time and at the same time you would have to store the current value somewhere and then write it back in.

How exactly were you intending the textfield to grow...meaning is it suppose to grow as the user is typing or are they suppose to click on something to make it grow? The former could cause frustration to the user if things disappear for a second while they are typing and then.

With that in mind you would constantly have to monitor the textbox to count the number of characters and then once you rewrite the contents of the layer you would have to set focus back to it and im not even sure if you can set the cursor position inside the textbox to the end of it because if the user is typing and it autmatically updates and the cursor starts back at the beginning they would end up either overwriting the beginning of the string or typing onto the front of it.

Of course is there any reason you can't use a textarea verses a text box?

[nolachrymose]

<input type="text" name="nums" maxlength="20" onkeypress="expandMax(this);"
<script type="text/javascript">
function expandMax(obj) {
var maxLen = obj.maxlength;
if(obj.length == maxLen) maxLen += 6;
}
</script>

Hope that helps!

Happy coding! :)

[glenngv]

Originally posted by nolachrymose
<input type="text" name="nums" maxlength="20" onkeypress="expandMax(this);"
<script type="text/javascript">
function expandMax(obj) {
var maxLen = obj.maxlength;
if(obj.length == maxLen) maxLen += 6;
}
</script>

Hope that helps!

Happy coding! :)

how about if the user presses the DELETE button or BACKSPACE? You would still need to shorten the width.

IMO, this would just annoy the user.

[dfred]

here is the code i am using....it has been a while since i touched js and i forget some of it. do i have to do anything with the obj item to relate it to the name of the text box?
i added this to my page, and it did nothing. Also the initial text string will not always be the same length. ex:
1. 567, 678, 789
2. 234, 456, 678, 789, 890
so the initial max length needs to vary depending on what the length of the text string is i think.
for example if now i want to add 990 to the end of my string with 890 in it, i was hoping to have the text area expand once i started to type the 990 into it. i may be missing something in the following code because it does nothing not even error.

<input type="text" name="alteration#get_SCR_lines.scr_line_nbr#"
value="#get_SCR_lines.ALTERATION#" maxlength="20" onkeypress="expandMax(this);">&nbsp;

<script type="text/javascript">
function expandMax(obj) {
var maxLen = obj.maxlength;
if(obj.length == maxLen) maxLen += 6;
}
</script>