...

View Full Version : Adding charachter counter to a form?



iChick
07-18-2009, 08:04 PM
Hi!

How can I add this charachter counter to my form? Appreciate any help. :)


<script type="text/javascript">
function CheckFieldLength(go,count)
{var len = go.value.length;if (len)
{go.value = go.value.substring(0);}document.getElementById(count).innerHTML = len;}
</script>

<form>
<input type="text" name="go" id="go" size="64"
onkeyup="CheckFieldLength(go, 'count');" onkeydown="CheckFieldLength(go, 'count');" onmouseout="CheckFieldLength(go, 'count');"/>
<span id="count"></span>
</form>

My Form (it doubles as a Google search box):


<script>
function convert(theForm){
var els = theForm.getElementsByTagName('input');// store inputs
var q = els[0], color = els[1];

if(els[4].checked){// submit to google
theForm.action = 'http://www.google.com/search';
return true;
};

color.value = "You've chosen a "+ q.value +" color";
switch(q.value){// check the query
case 'red':
case 'green':
case 'blue':
location.href = color.value;
return false;
break;
default:
theForm.action="http://www.google.com/search";
break;
};
return true;
};
</script>

<form name= "myform" onsubmit='return convert(this)'> <input name='q' type='text' />
<input name='color' type='hidden' /> <input type='submit' value=" Enter " />
<br />
<input name="searchType" type="radio" value="" checked="checked" > <label for="all"> My Form </label>
<input name="searchType" type="radio" value="google" onclick="document.myform.action='http://www.google.com/search';" />
<label for="google"> Google Search </label></form>

Philip M
07-18-2009, 08:25 PM
I am not sure that I understand you, you have it in front of you, but add this script:-


<script type="text/javascript">
function CheckFieldLength(go,count) {
var len = go.value.length;
if (len) {
go.value = go.value.substring(0);
}
document.getElementById(count).innerHTML = len;
}
</script>

and change the form particulars to


<input type="text" name="go" id="go" size="64"
onkeyup="CheckFieldLength(go, 'count');" onkeydown="CheckFieldLength(go, 'count');" onmouseout="CheckFieldLength(go, 'count');"/>
<span id="count"></span><br>
<input name='q' type='text' />


This counts the characters but does not restrict their number. What is the purpose of the character count?

He who laughs last, thinks slowest.

iChick
07-19-2009, 10:47 PM
I've tried adding that (code below) but it doesn't work. What am I doing wrong? Thanks for taking the time. :)


<script>
function convert(theForm){
var els = theForm.getElementsByTagName('input');// store inputs
var q = els[0], color = els[1];

if(els[4].checked){// submit to google
theForm.action = 'http://www.google.com/search';
return true;
};

color.value = "You've chosen a "+ q.value +" color";
switch(q.value){// check the query
case 'red':
case 'green':
case 'blue':
location.href = color.value;
return false;
break;
default:
theForm.action="http://www.google.com/search";
break;
};
return true;
};
</script>

<script type="text/javascript">
function CheckFieldLength(go,count) {
var len = go.value.length;
if (len) {
go.value = go.value.substring(0);
}
document.getElementById(count).innerHTML = len;
}
</script>

<form name="go" id="go" onsubmit='return convert(this)'
onkeyup="CheckFieldLength(go, 'count');" onkeydown="CheckFieldLength(go, 'count');" onmouseout="CheckFieldLength(go, 'count');"/> <input name='q' type='text' />
<input name='color' type='hidden' /> <input type='submit' value=" Enter " /><span id="count"></span>
<br />
<input name="searchType" type="radio" value="" checked="checked" > <label for="all"> My Form </label>
<input name="searchType" type="radio" value="google" onclick="document.myform.action='http://www.google.com/search';" />
<label for="google"> Google Search </label></form>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum