Archive · January 11, 2011
PHP + Javascript - limit characters in multiple text areas within same form
Javascript
<script language="javascript" type="text/javascript">
//http://www.phpfreaks.com/forums/javascript-help/%28solved%29-javascript-character-limit-with-multiple-textareas/
function checkTextArea(id,limit){
//alert ("id " +id +" limit " + limit);
if (document.getElementById(id)){
//alert("id " + id);
var txt = document.getElementById(id).value;
if (txt.length>limit){
//alert ("reached text limit: " + limit + " characters");
document.getElementById(id).value = txt.substr(0,limit);
}
len = document.getElementById(id).value.length;
//alert ("len: " + len);
//alert ("limit");
span_id = "counter" + id;
//alert ("span_ID " +span_id);
if (document.getElementById(span_id)){
document.getElementById(span_id).innerHTML = "<b>"+(limit-len)+"</b> characters remaining.";
} // if
} //if
} //function
</script>
PHP
<?
foreach($listing_file as $listing_file_row) {
$row_count++;
$path_to_file = $site_dir_listing . "/" . $listing_id . "/t_" . $listing_file_row['file_name'];
$path_to_delete = $file_basedir_listing . "/" . $listing_id . "/" . $listing_file_row['file_name'];
$file_row_id = $listing_file_row['row_id'];
//fb ("path_to_file", $path_to_file);
echo "
<input name=\"row_id[]\" type=\"hidden\" value=". $file_row_id." >
<input name=\"path_to_file[]\" type=\"hidden\" value=".$path_to_file." >
<tr>
<td width=\"205\"><img src=" . $path_to_file . " /> <br>
<td >
photo title*:
<br>
<textarea onkeyup=\"checkTextArea('pic".$file_row_id."',90);\" name=\"title[]\" id=\"pic".$file_row_id."\" rows=\"3\" style=\"width: 350px; height: 50px; margin-bottom: 10px;\">".$listing_file_row['title']."</textarea>
<br><span id=\"counterpic".$file_row_id."\">90 characters total.</span></script>
<br>
<input type=\"radio\" name=\"default_image\" value=\"$listing_file_row[row_id]\"";
if($listing_file_row['default_photo']) echo " checked";
echo "> default photo**
<a class=\"button\" href=\"?action=delete_photo&path=$path_to_delete&row_id=$file_row_id\" onclick=\"this.blur();\"><span>Delete</span></a>
</td>
</tr>";
}
?>