The following script basically counts the characters in a text area and shows the number of characters on the fly. I need to have the combined total of four text areas limited to an amount and would like it to display the count as this script does. For example: a contact form that contains "Name", "E-Mail", "Phone" and "Message" fields that when combined can only reach 140 characters. The current form I am using unfortunately is not cross-browser compatible, so I am interested in correcting that as well, but am not sure how to go about it.
Here is a form that functions similar to what I would like to do.
http://www.txt.bellmobility.ca/bmc/en/
Here is the code:
code:
<script language = "Javascript">
function taLimit() {
var taObj=event.srcElement;
if (taObj.value.length==taObj.maxLength*1) return false;
}
function taCount(visCnt) {
var taObj=event.srcElement;
if (taObj.value.length>taObj.maxLength*1) taObj.value=taObj.value.substring(0,taObj.maxLength*1);
if (visCnt) visCnt.innerText=taObj.maxLength-taObj.value.length;
}
</script>
<td width="267" height="560" align="left" valign="top"> <p> </p>
<?php
if ($_POST)
{
$name = $_POST['name'];
$email = $_POST['email'];
$comments = $_POST['comments'];
$message = "Message from $name ($email)\n\nPhone:$phone\n\nMessage:$message";
mail("info@yourname.com", "Test ESR", $message, "From: $name <$email>" );
echo "<p>Your Emergency Support Request has been submitted.<br>One of our representatives will contact<br>you shortly. Thank you. </p>\n";
}
else
{
?>
_Emergency Support Contact Form </span>
</p> <form action="<?= $PHP_SELF ?>" method="post">
<table width="265" border="0" cellspacing="0" cellpadding="1">
<tr>
<td width="74" align="left" valign="top"><span class="body">From:</span></td>
<td width="187" class="xtrasmall"><input name="name" type="text" id="name" size="25">
<br>
Enter your personal name.</td>
</tr>
<tr>
<td colspan="2" align="left" valign="top"> </td>
</tr>
<tr>
<td colspan="2" align="left" valign="top" class="xtrasmall style12"><p class="style14">Please provide contact information that you will be available at over the next few hours.</p> </td>
</tr>
<tr>
<td align="left" valign="top"><span class="body"> Email: </span></td>
<td><input name="email" type="text" size="25" /></td>
</tr>
<tr>
<td width="80" align="left" valign="top"><span class="body"> Phone:</span></td>
<td><input name="phone" type="text" id="phone" size="25"></td>
</tr>
<tr>
<td align="left" valign="top" class="body"><p>Message:<br>
<span class="xtrasmall">Limit message to
140 characters.<br>
See below for current count.</span> <br>
</p> </td>
<td><span class="style10">
<TEXTAREA onkeypress="return taLimit()" onkeyup="return taCount(myCounter)"
name="message" rows="7" wrap=physical cols="19" maxLength="140"></TEXTAREA>
<br>
Characters remaining <B><SPAN id=myCounter>140</SPAN></B>
</span></td>
</tr>
<tr>
<td align="left" valign="top"><img src="../Images/spacer.gif" width="75" height="1"></td>
<td><span class="style10">
<input name="submit2" type="image" value="Submit" src="../Images/submit.jpg" alt="Submit Form" width="69" height="25" />
</span></td>
</tr>
</table>
<span class="style10">
<?php
}
?>
I apologize in advance - I am new.
Thanks!