NAME

HTML::Object::DOM::Element::TextArea - HTML Object DOM TextArea Class

SYNOPSIS

use HTML::Object::DOM::Element::TextArea;
my $textarea = HTML::Object::DOM::Element::TextArea->new || 
    die( HTML::Object::DOM::Element::TextArea->error, "\n" );

VERSION

v0.2.0

DESCRIPTION

This interface provides special properties and methods for manipulating the layout and presentation of <textarea> elements.

INHERITANCE

+-----------------------+     +---------------------------+     +-------------------------+     +----------------------------+     +--------------------------------------+
| HTML::Object::Element | --> | HTML::Object::EventTarget | --> | HTML::Object::DOM::Node | --> | HTML::Object::DOM::Element | --> | HTML::Object::DOM::Element::TextArea |
+-----------------------+     +---------------------------+     +-------------------------+     +----------------------------+     +--------------------------------------+

PROPERTIES

Inherits properties from its parent HTML::Object::DOM::Element

METHODS

Inherits methods from its parent HTML::Object::DOM::Element

EVENTS

Event listeners for those events can also be found by prepending on before the event type:

click event listeners can be set also with onclick method:

$e->onclick(sub{ # do something });
# or as an lvalue method
$e->onclick = sub{ # do something };

input

Fires when the value of an input, select, or textarea element has been changed.

Example:

<input placeholder="Enter some text" name="name"/>
<p id="values"></p>

my $input = $doc->querySelector('$input');
my $log = $doc->getElementById('values');

$input->addEventListener( input => \&updateValue );

sub updateValue
{
    my $e = shift( @_ );
    $log->textContent = $e->target->value;
}

See also Mozilla documentation

selectionchange

Under perl, this does not do anything of course, but you can fire yourself the event.

Under JavaScript, this fires when the text selection in a textarea element has been changed.

Example:

<div>Enter and select text here:<br><textarea id="mytext" rows="2" cols="20"></textarea></div>
<div>selectionStart: <span id="start"></span></div>
<div>selectionEnd: <span id="end"></span></div>
<div>selectionDirection: <span id="direction"></span></div>

my $myinput = $doc->getElementById( 'mytext' );

$myinput->addEventListener( selectionchange => sub
{
    $doc->getElementById( 'start' )->textContent = $mytext->selectionStart;
    $doc->getElementById( 'end' )->textContent = $mytext->selectionEnd;
    $doc->getElementById( 'direction' )->textContent = $mytext->selectionDirection;
});

See also Mozilla documentation

EVENT HANDLERS

oninput

Property to handle event of type input. Those events are not automatically fired, but you can trigger them yourself.

onselectionchange

Property to handle event of type selectionchange. Those events are not automatically fired, but you can trigger them yourself.

AUTHOR

Jacques Deguest <jack@deguest.jp>

SEE ALSO

Mozilla documentation, Mozilla documentation on textarea element

COPYRIGHT & LICENSE

Copyright(c) 2022 DEGUEST Pte. Ltd.

All rights reserved

This program is free software; you can redistribute it and/or modify it under the same terms as Perl itself.