capture 'Paste' event in text-area

[RJ]

The scenario is.... there is a text-area that is used as chatbox where
user enters their text msgs for chatting ..now it has a fixed width
but the height increases according to the content.... now the problem
that i am facing is whenver i do a cntrl+v on to the textarea , the
height of the textarea does not increase according to the contents.
I tried capturing the cntrl key event using "event.ctrlKey" on
"onkeypress" event, but i works only for FF and fails in IE and
chrome.

Is there any way by which i can capture 'Paste' event......

Any help wld be highly appreciated.

Thanks,
RJ

 

[Erwin Moller]

RJ schreef:

The scenario is.... there is a text-area that is used as chatbox where
user enters their text msgs for chatting ..now it has a fixed width
but the height increases according to the content.... now the problem
that i am facing is whenver i do a cntrl+v on to the textarea , the
height of the textarea does not increase according to the contents.
I tried capturing the cntrl key event using "event.ctrlKey" on
"onkeypress" event, but i works only for FF and fails in IE and
chrome.

Is there any way by which i can capture 'Paste' event......

Any help wld be highly appreciated.

Thanks,
RJ

Hi,

Have a look here:
http://www.quirksmode.org/dom/w3c_events.html#keyprops

Please note the listed keydown and keyup. keypress is NOT listed.

Good luck.

Regards,
Erwin Moller


--
"There are two ways of constructing a software design: One way is to
make it so simple that there are obviously no deficiencies, and the
other way is to make it so complicated that there are no obvious
deficiencies. The first method is far more difficult."
-- C.A.R. Hoare

 

[David Mark]

RJ schreef:





Hi,

Have a look here:http://www.quirksmode.org/dom/w3c_events.html#keyprops

Please note the listed keydown and keyup. keypress is NOT listed.

That site should not be treated as reference material. I consider it
harmful as the descriptions of the "quirks" are often confused (among
other things.)

And I don't see the problem with the keypress event in general
(whether it is listed on PPK's page or not.) Certainly none of the
key* events will help with a keyboard accelerator like Ctrl+V, which
is eaten by the browser.

I believe IE has a proprietary paste event. Agents without such
extensions will have to make do with keyup and change (keypress is
clearly wrong in this context.)

[snip]

 

[David Mark]

RJ schreef:





Hi,

Have a look here:http://www.quirksmode.org/dom/w3c_events.html#keyprops

Please note the listed keydown and keyup. keypress is NOT listed.

Didn't read that right the first time. It is correct that the
properties *Key properties are not available during a keypress event,
which only makes sense as the character code is "cooked" at that point.

 

[Erwin Moller]

David Mark schreef:

That site should not be treated as reference material. I consider it
harmful as the descriptions of the "quirks" are often confused (among
other things.)

Hi David,

That table gives a nice overview which browser supports which metakeys.
Allthough I never use quirksmode as a reference, its listings with
compatibilities are useful and pleasantly presented and easily understood.

Since the OP had troubles with support in different browser for the
keypress this seems like a good place to start reading.

Which website would you advise to look up this kind of information?

Regards,
Erwin Moller

--
"There are two ways of constructing a software design: One way is to
make it so simple that there are obviously no deficiencies, and the
other way is to make it so complicated that there are no obvious
deficiencies. The first method is far more difficult."
-- C.A.R. Hoare

 

[David Mark]

David Mark schreef:





Hi David,

That table gives a nice overview which browser supports which metakeys.
Allthough I never use quirksmode as a reference, its listings with
compatibilities are useful and pleasantly presented and easily understood..

Since the OP had troubles with support in different browser for the
keypress this seems like a good place to start reading.

Which website would you advise to look up this kind of information?

Depends on what kind you mean. Quirksmode.org is okay for an overview
of (some) browser differences, just ignore the attempts at explanation.

 

[Erwin Moller]

David Mark schreef:

Depends on what kind you mean.

I mean the kind that says which browser(version) supports which metakey.


Quirksmode.org is okay for an overview

of (some) browser differences, just ignore the attempts at explanation.

I take your word for it their explanations are bad.
I possibly couldn't comment on that myself since I never used that site
for anything else than quick compatibility lookups. ;-)

But if you have some other resource that collects this kind of
information ('this kind' meaning: 'browser compatibility lists for a lot
of stuff an every day webdeveloper needs'), I'll be glad to hear where
to find it.
This quirksmode happens to be the only one I know of that has so much.

Regards,
Erwin Moller


--
"There are two ways of constructing a software design: One way is to
make it so simple that there are obviously no deficiencies, and the
other way is to make it so complicated that there are no obvious
deficiencies. The first method is far more difficult."
-- C.A.R. Hoare

 

[RJ]

David Mark schreef:





I mean the kind that says which browser(version) supports which metakey.

Quirksmode.org is okay for an overview


I take your word for it their explanations are bad.
I possibly couldn't comment on that myself since I never used that site
for anything else than quick compatibility lookups. ;-)

But if you have some other resource that collects this kind of
information ('this kind' meaning: 'browser compatibility lists for a lot
of stuff an every day webdeveloper needs'), I'll be glad to hear where
to find it.
This quirksmode happens to be the only one I know of that has so much.

Regards,
Erwin Moller

--
"There are two ways of constructing a software design: One way is to
make it so simple that there are obviously no deficiencies, and the
other way is to make it so complicated that there are no obvious
deficiencies. The first method is far more difficult."
-- C.A.R. Hoare

Very Thanks to all for ur replies...... but i haven't got solution to
my problem as to how to increase height of the text area when contents
are pasted into it.

Now the thing is "keypress" event yields result in FF, but not with IE
and others, for IE and rest , the option available is "onkeyup" and
"onkeydown", but then the corresponding function would be called twice
for "cntrl+v" and hence that option will also won't work..... and
regarding "onpaste" event , it is only applicable for IE. I am sure
der must be some way to achieve this task.....

Guys, if you can help....

Thanks,
RJ

 

[David Mark]

[snip]

Very Thanks to all for ur replies...... but i haven't got solution to
my problem as to how to increase height of the text area when contents
are pasted into it.

Yes. Among other things.

Now the thing is "keypress" event yields result in FF, but not with IE
and others, for IE and rest , the option available is "onkeyup" and
"onkeydown", but then the corresponding function would be called twice
No.

for "cntrl+v" and hence that option will also won't work..... and
regarding "onpaste" event , it is only applicable for IE. I am sure
der must be some way to achieve this task.....

Trying to intercept an OS-specific keyboard accelerator (e.g. Ctrl+V)
is silly. The paste event is available in IE. Other than that, you
are SOL AFAIK.

[snip]

 

[RJ]

[snip]

Very Thanks to all for ur replies...... but i haven't got solution to
my problem as to how to increase height of the text area when contents
are pasted into it.

Yes. Among other things.

Now the thing is "keypress" event yields result in FF, but not with IE
and others, for IE and rest , the option available is "onkeyup" and
"onkeydown", but then the corresponding function would be called twice
No.

for "cntrl+v" and hence that option will also won't work..... and
regarding "onpaste" event , it is only applicable for IE. I am sure
der must be some way to achieve this task.....

Trying to intercept an OS-specific keyboard accelerator (e.g. Ctrl+V)
is silly. The paste event is available in IE. Other than that, you
are SOL AFAIK.

[snip]

ya.... 2 days of research yet no result... even i feel m SOL.... but i
have seen some application(especially facebook), where this particular
thing has been achieved..

I'll posts in if i get a soln... meanwhile if anybody know how to
tackle it....

Thanks,
RJ

 

[David Mark]

[snip]

Very Thanks to all for ur replies...... but i haven't got solution to
my problem as to how to increase height of the text area when contents
are pasted into it.

Yes.  Among other things.

Trying to intercept an OS-specific keyboard accelerator (e.g. Ctrl+V)
is silly.  The paste event is available in IE.  Other than that, you
are SOL AFAIK.

[snip]

ya.... 2 days of research yet no result... even i feel m SOL.... but i
have seen some application(especially facebook), where this particular
thing has been achieved..

Really? And how much of those two days was spent looking at their
code?

[snip]

 

[RJ]

[snip]
Very Thanks to all for ur replies...... but i haven't got solution to
my problem as to how to increase height of the text area when contents
are pasted into it.
Yes. Among other things.
Now the thing is "keypress" event yields result in FF, but not with IE
and others, for IE and rest , the option available is "onkeyup" and
"onkeydown", but then the corresponding function would be called twice
No.
for "cntrl+v" and hence that option will also won't work..... and
regarding "onpaste" event , it is only applicable for IE. I am sure
der must be some way to achieve this task.....
Trying to intercept an OS-specific keyboard accelerator (e.g. Ctrl+V)
is silly. The paste event is available in IE. Other than that, you
are SOL AFAIK.
[snip]

ya.... 2 days of research yet no result... even i feel m SOL.... but i
have seen some application(especially facebook), where this particular
thing has been achieved..

Really? And how much of those two days was spent looking at their
code?

[snip]

none actually.....but AFAIK, facebook uses their own DOM elements..

 

[RJ]

[snip]
Very Thanks to all for ur replies...... but i haven't got solution to
my problem as to how to increase height of the text area when contents
are pasted into it.
Yes. Among other things.
Now the thing is "keypress" event yields result in FF, but not with IE
and others, for IE and rest , the option available is "onkeyup" and
"onkeydown", but then the corresponding function would be called twice
No.
for "cntrl+v" and hence that option will also won't work..... and
regarding "onpaste" event , it is only applicable for IE. I am sure
der must be some way to achieve this task.....
Trying to intercept an OS-specific keyboard accelerator (e.g. Ctrl+V)
is silly. The paste event is available in IE. Other than that, you
are SOL AFAIK.
[snip]

ya.... 2 days of research yet no result... even i feel m SOL.... but i
have seen some application(especially facebook), where this particular
thing has been achieved..

Really? And how much of those two days was spent looking at their
code?

[snip]

none actually.....but AFAIK, facebook uses their own DOM elements..

 

[RJ]

[snip]
Very Thanks to all for ur replies...... but i haven't got solution to
my problem as to how to increase height of the text area when contents
are pasted into it.
Yes. Among other things.
Now the thing is "keypress" event yields result in FF, but not with IE
and others, for IE and rest , the option available is "onkeyup" and
"onkeydown", but then the corresponding function would be called twice
No.
for "cntrl+v" and hence that option will also won't work..... and
regarding "onpaste" event , it is only applicable for IE. I am sure
der must be some way to achieve this task.....
Trying to intercept an OS-specific keyboard accelerator (e.g. Ctrl+V)
is silly. The paste event is available in IE. Other than that, you
are SOL AFAIK.
[snip]

ya.... 2 days of research yet no result... even i feel m SOL.... but i
have seen some application(especially facebook), where this particular
thing has been achieved..

Really? And how much of those two days was spent looking at their
code?

[snip]

none actually.....but AFAIK, facebook uses their own DOM elements..

 

[David Mark]

[snip]
Very Thanks to all for ur replies...... but i haven't got solution to
my problem as to how to increase height of the text area when contents
are pasted into it.
Yes.  Among other things.
Now the thing is "keypress" event yields result in FF, but not with IE
and others, for IE and rest , the option available is "onkeyup" and
"onkeydown", but then the corresponding function would be called twice
No.
for "cntrl+v" and hence that option will also won't work..... and
regarding "onpaste" event , it is only applicable for IE. I am sure
der must be some way to achieve this task.....
Trying to intercept an OS-specific keyboard accelerator (e.g. Ctrl+V)
is silly.  The paste event is available in IE.  Other than that, you
are SOL AFAIK.
[snip]
ya.... 2 days of research yet no result... even i feel m SOL.... but i
have seen some application(especially facebook), where this particular
thing has been achieved..

Really?  And how much of those two days was spent looking at their
code?

[snip]

none actually.....but AFAIK, facebook uses their own DOM elements..

That is meaningless.

 

[Erwin Moller]

RJ schreef:

ya.... 2 days of research yet no result... even i feel m SOL.... but i
have seen some application(especially facebook), where this particular
thing has been achieved..

Really? And how much of those two days was spent looking at their
code?

[snip]

none actually.....but AFAIK, facebook uses their own DOM elements..

Huh? What do you mean by that?
Isn't the DOM defined by the browser?
Facebook is only manipulating the DOM.

Anyway, I think you can inspect their approach just fine.
Simply look at the code returned to your browser.
If they use JavaScript includes, simply fetch them too by hand for
futher inspection.
Start by looking for eventhandlers attached to the element, and see if
you can find out how they approach it.

Tip: You may have an easier time if you use FF with Firebug installed.

Regards,
Erwin Moller

PS: I still don't understand what is wrong with using the keyup event
you mentioned earlier.
Simply attach an eventhandler to your textarea, and check if the key in
question was 'v' AND if also the metakey ctrl is pressed at that time,
do your thing. Why doesn't that work for you?


--
"There are two ways of constructing a software design: One way is to
make it so simple that there are obviously no deficiencies, and the
other way is to make it so complicated that there are no obvious
deficiencies. The first method is far more difficult."
-- C.A.R. Hoare

 

[RJ]

RJ schreef:

ya.... 2 days of research yet no result... even i feel m SOL.... but i
have seen some application(especially facebook), where this particular
thing has been achieved..
Really? And how much of those two days was spent looking at their
code?
[snip]

none actually.....but AFAIK, facebook uses their own DOM elements..

Huh? What do you mean by that?
Isn't the DOM defined by the browser?
Facebook is only manipulating the DOM.

Anyway, I think you can inspect their approach just fine.
Simply look at the code returned to your browser.
If they use JavaScript includes, simply fetch them too by hand for
futher inspection.
Start by looking for eventhandlers attached to the element, and see if
you can find out how they approach it.

Tip: You may have an easier time if you use FF with Firebug installed.

Regards,
Erwin Moller

PS: I still don't understand what is wrong with using the keyup event
you mentioned earlier.
Simply attach an eventhandler to your textarea, and check if the key in
question was 'v' AND if also the metakey ctrl is pressed at that time,
do your thing. Why doesn't that work for you?

--
"There are two ways of constructing a software design: One way is to
make it so simple that there are obviously no deficiencies, and the
other way is to make it so complicated that there are no obvious
deficiencies. The first method is far more difficult."
-- C.A.R. Hoare

keyup event fires twice for cntrl+v in ff ..... hmmm i'll have to
inspect what facebook guys are doing...will kleep u guys updated on my
progress.

Thanks all for ur replies

 

[David Mark]

RJ schreef:

ya.... 2 days of research yet no result... even i feel m SOL.... but i
have seen some application(especially facebook), where this particular
thing has been achieved..
Really?  And how much of those two days was spent looking at their
code?
[snip]
none actually.....but AFAIK, facebook uses their own DOM elements..

Huh? What do you mean by that?
Isn't the DOM defined by the browser?
Facebook is only manipulating the DOM.

Anyway, I think you can inspect their approach just fine.
Simply look at the code returned to your browser.
If they use JavaScript includes, simply fetch them too by hand for
futher inspection.
Start by looking for eventhandlers attached to the element, and see if
you can find out how they approach it.

Tip: You may have an easier time if you use FF with Firebug installed.

Regards,
Erwin Moller

PS: I still don't understand what is wrong with using the keyup event
you mentioned earlier.
Simply attach an eventhandler to your textarea, and check if the key in
question was 'v' AND if also the metakey ctrl is pressed at that time,
do your thing. Why doesn't that work for you?

--
"There are two ways of constructing a software design: One way is to
make it so simple that there are obviously no deficiencies, and the
other way is to make it so complicated that there are no obvious
deficiencies. The first method is far more difficult."
-- C.A.R. Hoare

keyup event fires twice for cntrl+v in ff ..... hmmm i'll have to

As mentioned, it is silly to even attempt to detect Ctrl+V. What do
you think that means outside of Windows? Also, what if the paste (or
whatever) operation is done through the edit menu?

inspect what facebook guys are doing...will kleep u guys updated on my
progress.

They are likely using setInterval to poll the value of the textarea
and resizing when it changes. I can't imagine anything else that
would work reliably cross-browser.

[snip]

 

[Erwin Moller]

David Mark schreef:

As mentioned, it is silly to even attempt to detect Ctrl+V. What do
you think that means outside of Windows? Also, what if the paste (or
whatever) operation is done through the edit menu?

Hmm, you right of course.
And what is worse, you wrote that before. (slaps head)

RJ, are you still reading this?
Don't go that route ctrl-v route.

Erwin

--
"There are two ways of constructing a software design: One way is to
make it so simple that there are obviously no deficiencies, and the
other way is to make it so complicated that there are no obvious
deficiencies. The first method is far more difficult."
-- C.A.R. Hoare

 

[RJ]

David Mark schreef:


Hmm, you right of course.
And what is worse, you wrote that before. (slaps head)

RJ, are you still reading this?
Don't go that route ctrl-v route.

Erwin

--
"There are two ways of constructing a software design: One way is to
make it so simple that there are obviously no deficiencies, and the
other way is to make it so complicated that there are no obvious
deficiencies. The first method is far more difficult."
-- C.A.R. Hoare

hmmm... cntrl+v method wnt suffice.
David has suggested a good technique.... will try dat and let u guys
know..

Thanks all (especially David)