This topic is locked

How to limit number of characters in the text area

7/19/2010 7:46:35 AM
PHPRunner Tips and Tricks
J
Jane author

To limit number of characters in the text area use Edit page: JavaScript onload event on the Eventstab. Here is a sample:

var ctrlFieldName = Runner.getControl(pageid, 'FieldName');

document.getElementById('counter').value = ctrlFieldName.getValue().length;
function func()

{

//update counter

document.getElementById('counter').value = ctrlFieldName.getValue().length;
//check if length of the entered value <40 characters

if (ctrlFieldName.getValue().length>40)

{

//show first 40 characters only

ctrlFieldName.setValue(ctrlFieldName.getValue().substr(0,40));

//update counter

document.getElementById('counter').value = 40;

}

}

ctrlFieldName.on('keyup', func);



where FieldNameis your actual field name.
To create counter switch toHTML mode on the Visual Editor tab and add following code just after your text area field:

<input type=text value=0 id=counter disabled="disabled" size=3>
A
acpan 7/24/2010

Hi,
It seems to be conflict with the following codes.
I have the following codes to hide and display a group of

controls on the Add form base on some values which i adapt from

this post:
In before display, i have the following to hide some fields if record exist:

$xt->assign("my_group",$_SESSION["record"]>1);
In visual editor, i added the BEGIN and END tag to group the controls:

{BEGIN $my_group}

.... my controls/fields

{END $my_group}
This works well, but it make the limit character codes not working any more.
Is there a work around ?
Thanks

acp

M
mmponline 12/11/2010

This works great. I need one ammendment to it though. I want the lenght of the field to be dependant on a value of another field's value.

Eg

If Package field's value is "Free" the length of the Info field should be 25

If Package field's value is "Basic" the length of the Info field should be 50

If Package field's value is "Advvanced" the length of the Info field should be 1000
How would I ammend the code to achieve this?
Thank You

A
Angel Martin 3/17/2011

working with 5.3 7474 thanks a lot

M
mmponline 3/17/2011

Im sure it will work if you just add the code to the java script event of the add page and also ammend the add page's html in a similar way.

J
jacekq 3/24/2011

Hello,
What to do if I have textarea and Innova editor as Rich text?
Regards,

Jacek

R
Rapacious 8/1/2012

Great work! Works like a charm. Is there a way to make it real time? For EX: I would like to have it display 30/255 as someone types in the box.

M
mikeborschow 8/13/2012

[size="5"]THIS IS PERFECT![/size]

THANK YOU --- [size="4"]THANK YOU[/size] --- [size="6"]THANK YOU![/size]

S
skbrasil 9/6/2016



[size="5"]THIS IS PERFECT![/size]

THANK YOU --- [size="4"]THANK YOU[/size] --- [size="6"]THANK YOU![/size]


CSS
http://jsfiddle.net/csYjC/1131/
<div class="text">

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam consectetur venenatis blandit. Praesent vehicula, libero non pretium vulputate, lacus arcu facilisis lectus, sed feugiat tellus nulla eu dolor. Nulla porta bibendum lectus quis euismod. Aliquam volutpat ultricies porttitor. Cras risus nisi, accumsan vel cursus ut, sollicitudin vitae dolor. Fusce scelerisque eleifend lectus in bibendum. Suspendisse lacinia egestas felis a volutpat.

</div>
Code CSS

<code>

body {

margin: 20px;

}
.text {

overflow: hidden;

text-overflow: ellipsis;

display: -webkit-box;

line-height: 16px; / fallback /

max-height: 32px; / fallback /

-webkit-line-clamp: 2; / number of lines to show /

-webkit-box-orient: vertical;

} </code>