Limiting Characters In Text Area

[Marie]

Hello,

 

I have been looking through the posts and the two books - Effortless E-Commerce and PHP and MySql for Dynamic Websites but have not found any information on limiting the number of characters that a user can type into a text area or a counter that shows the user how many characters they have typed so far. Can this be done in PHP or is this just a javascipt thing?

 

Marie

[HartleySan]

You can limit the number of characters via HTML, PHP or JavaScript. The letter counter is a JavaScript thing though.

[Marie]

Okay I have been fooling around with this in the forms function script and on the php page itself and figure that I should be able to do this in the forms function.

 

The following however, did not work so I am wondering about the proper coding.

 

echo '<textarea name="' . $name . '" id="' . $name . '" rows="5" cols="150" minChars="2" maxChars="300"';

 

Can I write Javascipt within PHP?

 

Thanks,

 

Marie

[HartleySan]

It's not working because maxChars is not a valid HTML attribute. Please see the following:

http://www.w3schools...t_maxlength.asp

 

Also, yes, you can write JS in PHP. For example:

 

<?php 

 echo "<script> 

   alert('This is JS in PHP!'); 

 </script>"; 

?>

 

Be careful with escaping characters though. If possible, you're better off placing JS in HTML or a separate file that's linked to from the HTML.

[HartleySan]

Larry, as a random side note, I just went in to edit my above post from IE6, and the JS alert was actually alerted back to me.

Might want to check for any XSS vulnerabilities in your message board.

[Antonio Conte]

Very easy to do this in PHP.

 

$length = 150; // Set a length

$limited = mb_substr($_POST['name'], 0, $length); // See Post here.

[HartleySan]

I like the HTML solution though, as it's more immediately obvious to the user that the length is limited because the browser won't let them exceed the max when they enter input into the text field.

[Marie]

Thanks for your replies,

 

I noticed on the W3 schools website it says that IE and Opera doesn't support limiting the characters in a text area.

 

This can be done in Dreamweaver with Javascript with a counter but I prefer to use PHP and be consistent with the scripting as it is presented in Larry's books.

 

I am a Mac person and generally use Firefox as my browser.

 

However, I tried the following and it works somewhat. The characters are limited but the text area box spreads to about three times the width as well. I am still working on it.

 

echo '<textarea name="' . $name . '" id="' . $name . '" cols="150" rows="5" maxlength="25"';

 

Marie

[HartleySan]

For some reason, the whole time, I thought we were talking about text input boxes, not text areas.

Geez! I totally missed that one. Sorry.

 

I'd actually be surprised if any browser could natively limit the number of characters in a text area.

For a text area, JS will definitely give you the most fluid and instantaneous feedback.

 

If you do it in PHP, then you have to wait until the user submits the form to check the length.

[Larry]

If you're using HTML5 and the user's browser supports HTML5, you can use maxlength on text areas. Otherwise you'll need to use JavaScript (for the user's sake) and PHP (for making it a hard requirement).

[Marie]

After trying several things in the php page I went back to the forms function page and inserted the following code:

 

// Start creating the textarea:

echo

 

"<textarea name="limitedtextarea"

 

onKeyDown="limitText(this.form.limitedtextarea,this.form.countdown,100);"

 

 

onKeyUp="limitText(this.form.limitedtextarea,this.form.countdown,100)

 

 

<font size="1">(Maximum characters: 300)<br>

 

You have <input readonly type="text" name="countdown" size="5" value="300"> characters left.</font>

 

 

I get the following error - Parse error: syntax error, unexpected T_STRING, expecting ',' or ';'.

 

So I know that it cannot be correct and I have experimented by doing various things and nothing has worked so far. Just need to know if I am putting this code in the right place at all.

 

I have also tried putting the words <script> and <javascript> and variations in this code but this has not worked either.

 

When I put the Javascript on the php page I was getting two text areas - the one that was originally there that was sticky and the newer one that showed the counter and characters that were remaining. Obviously I don't want both and am trying to combine them. So I know that the javascript itself was working. I was getting a text area with a counter but it was not sticky or posting any errors.

 

Marie

[Larry]

If you're getting that error, it's a PHP error. Caused by the first use of " that's not marking the beginning or ending of a string. That's really not very good JavaScript, though. If you don't really know JavaScript and aren't trying to learn right now, the most foolproof solution would be to use jQuery, per instructions like these: http://web.enavu.com/daily-tip/maxlength-for-textarea-with-jquery/

 

That does require the jQuery library. Again, though, I'm always hesitant to suggestion someone try to implement JavaScript without really knowing it, as you're more likely to mess things up then get them right (and/or give yourself a false sense of it working when it isn't).

[Marie]

Right at the moment I am not into learning JavaScript or jQuery so I may just revert back to the original PHP. I hope that if I limit the database to 200 characters or whatever then it will not accept any more than that.

 

Thanks for your help.

 

Marie

[Antonio Conte]

You are correct. The DB will truncate the left over content, but you should make sure the users know this too.