added: Textarea now supports maxlength attribute

This commit is contained in:
Doug Bell 2008-10-24 19:54:30 +00:00
parent 6a10ae16d5
commit 3fc8c25025
2 changed files with 76 additions and 11 deletions

View file

@ -62,27 +62,34 @@ Style attributes besides width and height which should be specified using the ab
A boolean indicating whether the text area can be reized by users. Defaults to 1.
=head4 maxlength
The maximum number of characters to allow in this field. If not defined, will not do any limiting.
=cut
sub definition {
my $class = shift;
my $session = shift;
my $definition = shift || [];
push(@{$definition}, {
my $class = shift;
my $session = shift;
my $definition = shift || [];
push @{$definition}, {
height=>{
defaultValue=> 150
},
},
width=>{
defaultValue=> 400
},
},
style=>{
defaultValue => undef,
},
},
resizable => {
defaultValue => 1,
},
});
return $class->SUPER::definition($session, $definition);
},
maxlength => {
defaultValue => ''
},
};
return $class->SUPER::definition($session, $definition);
}
#-------------------------------------------------------------------
@ -138,7 +145,26 @@ sub toHtml {
my ($style, $url) = $self->session->quick(qw(style url));
my $styleAttribute = "width: ".$width."px; height: ".$height."px; ".$self->get("style");
$style->setRawHeadTags(qq|<style type="text/css">\ntextarea#|.$self->get('id').qq|{ $styleAttribute }\n</style>|);
my $out = '<textarea id="'.$self->get('id').'" name="'.$self->get("name").'" '.$self->get("extras").' rows="#" cols="#" style="width: '.$width.'px; height: '.$height.'px;">'.$value.'</textarea>';
my $out = '<textarea id="'.$self->get('id').'" name="'.$self->get("name").'" '
. ( $self->get("maxlength") ? 'maxlength="' . $self->get( "maxlength" ) . '" ' : '' )
. $self->get("extras") . ' rows="#" cols="#" style="width: '.$width.'px; height: '.$height.'px;">'.$value.'</textarea>'
;
# Add the maxlength script
$style->setScript(
$url->extras( 'yui/build/yahoo-dom-event/yahoo-dom-event.js' ),
{ text => 'text/javascript' },
);
$style->setScript(
$url->extras( 'yui-webgui/build/form/textarea.js' ),
{ type => 'text/javascript' },
);
$style->setRawHeadTags( q|
<script type="text/javascript">
YAHOO.util.Event.onDOMReady( function () { WebGUI.Form.Textarea.setMaxLength() } );
</script>
| );
if ($self->get("resizable")) {
$style->setLink($url->extras("resize.css"), {type=>"text/css", rel=>"stylesheet"});
$style->setLink($url->extras("resize-skin.css"), {type=>"text/css", rel=>"stylesheet"});

View file

@ -0,0 +1,39 @@
// Initialize namespace
if (typeof WebGUI == "undefined") {
var WebGUI = {};
}
if (typeof WebGUI.Form == "undefined") {
WebGUI.Form = {};
}
WebGUI.Form.Textarea = {};
/****************************************************************************
*
* WebGUI.Form.Textarea
* Scripts for the textarea control.
*
*/
WebGUI.Form.Textarea.checkMaxLength
= function () {
var maxLength = this.getAttribute('maxlength');
var currentLength = this.value.length;
if (currentLength > maxLength) {
this.value = this.value.substring( 0, maxLength );
alert( "This field can only contain " + maxLength + " characters" );
}
}
WebGUI.Form.Textarea.setMaxLength
= function () {
var x = document.getElementsByTagName('textarea');
for ( var i = 0; i < x.length; i++ ) {
if (x[i].getAttribute('maxlength')) {
YAHOO.util.Event.addListener( x[i], "change", WebGUI.Form.Textarea.checkMaxLength );
YAHOO.util.Event.addListener( x[i], "keyup", WebGUI.Form.Textarea.checkMaxLength );
}
}
}