How to limit characters in system.xml for textarea in magento

Question

I want to restrict textarea characters length to 150 characters, My system.xml code is below :

...
<orderPlaceMessage translate="label">
 <label>Message for order place: </label>
 <frontend_type>textarea</frontend_type>
 <sort_order>1</sort_order>
 <show_in_default>1</show_in_default>
 <show_in_website>1</show_in_website>
 <show_in_store>1</show_in_store>
 {how to limit character length }
</orderPlaceMessage>
...

How to to that?

Answer 1

Add the following to the <orderPlaceMessage> element:

<validate>validate-length maximum-length-150</validate>

This will add these validation CSS classes used by prototype.js. If you enter a longer value, you will see this generic validation message:

Text length does not satisfy specified text range

So it is a good idea to add a comment as well to let the user know what this range is:

<comment>Maximum length: 150 characters</comment>

If the limit is important for data integrity, you should also add server side validatation, using a backend model. Digital Pianism already linked a tutorial for this: http://alanstorm.com/magento_system_config_validation

And if you want to know more about the various options in system.xml, there is: http://alanstorm.com/magento_system_configuration_in_depth_tutorial

Answer 2

Client side validation:

I reckon you have to use the validate tag and create your own validation routine to limit the number of characters.

Have a look here : http://blog.baobaz.com/en/blog/custom-javascript-form-validators

Server side validation:

A bit more code and implies clicking on the save button before validating the data: http://alanstorm.com/magento_system_config_validation

Answer 3

I have used below jQuery script for limit character length :

jQuery("#sms_cnfg_advanced_settings textarea").keypress(function(event){
 var maxLength = 160;
 var length = this.value.length;
 if (length >= maxLength)
 {
 this.value = this.value.substring(0, maxLength);
 alert(maxLength + ' characters allowed, excess characters trimmed');
 }
});
jQuery("#sms_cnfg_advanced_settings textarea").on('keyup',function(){
 jQuery('.charnum').remove();
 var maxLength = 160;
 var length = this.value.length;
 var count=maxLength-length;
 jQuery('<span class="charnum">' +count+' Characters left</span>').insertAfter(jQuery(this));
});