Case Study : Create script to count the character in the textarea
Requirements: WebServer Package, already installed.
Maybe we have ever find sms web application, ie applications that are used to send sms via web applications. Here we will not discuss about the processing of SMS, but we will discuss about the interface that is used in sending sms, usually in the form textarea, which will provide certain limitations on number of characters that have been determined (on sms, generally is 160 characters)
Nah. How do we calculate the characters written in the textarea?
With Javascript.
Step 1 : Prepare the work directory
- Create folder named tutorphp in your document root
- Save all file in this tutorial in this folder.
Step 2 :Create Form Textarea
- Type the following script,
[sourcecode language=”php”]
<html><head>
<title>Itx.Web.Id</title>
<script type="text/javascript" src="cek_karakter.js"></script>
</head>
<body>
<form name=form method=post>
<h3> Write Your Message Here </h3>
<textarea onKeyPress=cek_karakter(this.form); onKeyDown=cek_karakter(this.form); name=teks rows=4 cols=30></textarea>
<br> <br>
<input size=1 value=10 name=total>
</form>
</body></html>
[/sourcecode] - Save with the name hitung_textarea.php
Step 3 : Create Javascript to Count Character in the Textarea
- Type the following script,
[sourcecode language=”javascript”]
function cek_karakter(form) {
maks = 10; // max character
if (form.teks.value.length >= maks) {
var message = "0 Character Left ! "; //alert if character limit reacher
alert(message);
form.teks.value = form.teks.value.substring(0, maks); //trim the textarea
}
else {
form.total.value = maks – form.teks.value.length;} //count the character
}
[/sourcecode] - Save with the name cek_karakter.js
Step 4 : Testing Code
- Go to http://localhost/tutorial/hitung_karakter.php. You’ll see a form that you created, with the character limit is 10 (you can set yourself)
- Try typing something in the textarea, then the counter will start counting down, and when the character limit has been reached, the alerts appear as shown below
2 replies on “Count TextArea Character in the Form with PHP”
Hi, saya menggunakan tema bombax di perkotaan di situs saya (gabriellemagazine.com) Saya ingin memiliki 9 entri di halaman depan, bukan 10 sehingga terlihat seperti majalah. Bisa tolong melihat dan katakan padaku apa yang harus dilakukan? Terima kasih.
Hi, I am using the bombax theme in urban on my site (gabriellemagazine.com) I want to have 9 entries on the front page instead of 10 so that it looks like a magazine. Could you please take a look and tell me what to do? Thanks.