472,961 Members | 1,548 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 472,961 software developers and data experts.

Select text within a div tag by clicking on content of div tag or a button?

Hi this is a question asked in this group two years back..
No answer for this question till date.
now i am in the same situation of the questioner.. to find a solution
for this problem.

Can any one help me in this regard.?

The question is:
----------------------------------------------------------------------------------------------------
Wondering if anyone can tell me if it's possible to have Javascript
select the contents of a div tag with a unique id by clicking
somewhere in the contents of that div tag?

I want to make it as easy as possible for users to copy the contents
of the div tag for pasting in another page. So, instead of having them
use the mouse to drag the selection, which can sometimes be annoying,
I'd like to have them click anywhere within the div tag and have the
text automatically selected, and then they can simply right click and
select 'Copy'.

If this is possible, can anyone give me some advice on how to achieve
it?

As an alternative, if a div tag won't respond to an onClick event
itself, would it be possible to select the contents of that div tag
(assume, for eg, that it has the unique id of "Copy1") by clicking on
a button?

Any help with this would be much appreciated!
Much warmth,

Murray
----------------------------------------------------------------------------------------------------
thanx for both questioner and the person who is going to reveal a
solution for this.

Nov 21 '06 #1
5 3884

visu wrote:
Hi this is a question asked in this group two years back..
No answer for this question till date.
now i am in the same situation of the questioner.. to find a solution
for this problem.

Can any one help me in this regard.?

The question is:
----------------------------------------------------------------------------------------------------
Wondering if anyone can tell me if it's possible to have Javascript
select the contents of a div tag with a unique id by clicking
somewhere in the contents of that div tag?

I want to make it as easy as possible for users to copy the contents
of the div tag for pasting in another page. So, instead of having them
use the mouse to drag the selection, which can sometimes be annoying,
I'd like to have them click anywhere within the div tag and have the
text automatically selected, and then they can simply right click and
select 'Copy'.

If this is possible, can anyone give me some advice on how to achieve
it?

As an alternative, if a div tag won't respond to an onClick event
itself, would it be possible to select the contents of that div tag
(assume, for eg, that it has the unique id of "Copy1") by clicking on
a button?

Any help with this would be much appreciated!
Much warmth,

Murray
----------------------------------------------------------------------------------------------------
thanx for both questioner and the person who is going to reveal a
solution for this.
This sounds like an incredibly ambitious project and it would help you
to first gain some experience with JavaScript/HTML on some more trivial
projects before tackling this. Once you do, you'll have some insight
into some of the questions that come up.

So, all div tags will respond no problem to an onclick event (always
call it onclick, never onClick - javascript is case-sensitive and so
is XHTML, so it's best to just adopt this convention). However, the
question is - *what* do you want copied. Do you want the entire
contents of a div tag? If so, then a recursive function is the way to
get the text of an element:

function getText(node) {
var txt = '';
if (node.nodeType == 3) // i.e. it's a text node
txt += node.nodeValue;

for (var i=0; i < node.childNodes.length; i++)
txt += getText(node.childNodes[i]);

return txt;
};

Or do you want the div tag itself? Then you can just clone the node:

var newNode = node.cloneNode(true); // optional argument is true if
you want to clone children as well

Or do you want only a portion of the contents of the div tag? How are
you going to have the user specify which portion is to be selected if
they just click once and aren't dragging?

Also, I would discourage you from trying to mess with the right-click
button. Browsers have control over the right-click context menu and
there is little you can do to turn that off reliably in all browsers.
Give them a "paste" button instead.

Alternativley, you might want to just give users a textarea they can
dump text into.

-David

Nov 21 '06 #2
David Golightly escreveu:
visu wrote:
>Wondering if anyone can tell me if it's possible to have Javascript
select the contents of a div tag with a unique id by clicking
somewhere in the contents of that div tag?
It's not very reliable what I've wrote, but take a look:

function select(o){
if(window.getSelection && document.createRange){
var s = window.getSelection(), r = document.createRange();
r.selectNode(o), s.removeAllRanges(), s.addRange(r);
}
else if(o.createTextRange)
o.createTextRange().select();
}

select(document.body);
Alternativley, you might want to just give users a textarea they can
dump text into.
As a user I preffer to choose what I'll copy and paste, but if the job
is a kind of routine, then I think you should copy the html/text of the
element instead of selecting it visually.
--
Jonas Raoni Soares Silva
http://www.jsfromhell.com
Nov 21 '06 #3
ASM
visu a écrit :
Hi this is a question asked in this group two years back..
No answer for this question till date.
now i am in the same situation of the questioner.. to find a solution
for this problem.

Can any one help me in this regard.?
a subterfuge ?

function copi(what) {
var T = document.createElement('textarea');
T.id='temp';
T.value = what.innerHTML;
T.style.width = '100%';
T.title = 'Clic me to delete me';
T.onclick = function(){document.body.removeChild(this); }
document.body.insertBefore(T,what);
document.getElementById('temp').select();
alert('right-click in selected area an chose "copy");
}

<div onclick="copi(this)">
blah
</div>
The question is:
----------------------------------------------------------------------------------------------------
Wondering if anyone can tell me if it's possible to have Javascript
select the contents of a div tag with a unique id by clicking
somewhere in the contents of that div tag?
my idea : no (you gan get a selection but not set it)


--
Stephane Moriaux et son (moins) vieux Mac déjà dépassé
Stephane Moriaux and his (less) old Mac already out of date
Nov 21 '06 #4

David Golightly wrote:
visu wrote:
Hi this is a question asked in this group two years back..
No answer for this question till date.
now i am in the same situation of the questioner.. to find a solution
for this problem.

Can any one help me in this regard.?

The question is:
----------------------------------------------------------------------------------------------------
Wondering if anyone can tell me if it's possible to have Javascript
select the contents of a div tag with a unique id by clicking
somewhere in the contents of that div tag?

I want to make it as easy as possible for users to copy the contents
of the div tag for pasting in another page. So, instead of having them
use the mouse to drag the selection, which can sometimes be annoying,
I'd like to have them click anywhere within the div tag and have the
text automatically selected, and then they can simply right click and
select 'Copy'.

If this is possible, can anyone give me some advice on how to achieve
it?

As an alternative, if a div tag won't respond to an onClick event
itself, would it be possible to select the contents of that div tag
(assume, for eg, that it has the unique id of "Copy1") by clicking on
a button?

Any help with this would be much appreciated!
Much warmth,

Murray
----------------------------------------------------------------------------------------------------
thanx for both questioner and the person who is going to reveal a
solution for this.

This sounds like an incredibly ambitious project and it would help you
to first gain some experience with JavaScript/HTML on some more trivial
projects before tackling this. Once you do, you'll have some insight
into some of the questions that come up.

So, all div tags will respond no problem to an onclick event (always
call it onclick, never onClick - javascript is case-sensitive and so
is XHTML, so it's best to just adopt this convention). However, the
question is - *what* do you want copied. Do you want the entire
contents of a div tag? If so, then a recursive function is the way to
get the text of an element:

function getText(node) {
var txt = '';
if (node.nodeType == 3) // i.e. it's a text node
txt += node.nodeValue;

for (var i=0; i < node.childNodes.length; i++)
txt += getText(node.childNodes[i]);

return txt;
};

Or do you want the div tag itself? Then you can just clone the node:

var newNode = node.cloneNode(true); // optional argument is true if
you want to clone children as well

Or do you want only a portion of the contents of the div tag? How are
you going to have the user specify which portion is to be selected if
they just click once and aren't dragging?

Also, I would discourage you from trying to mess with the right-click
button. Browsers have control over the right-click context menu and
there is little you can do to turn that off reliably in all browsers.
Give them a "paste" button instead.

Alternativley, you might want to just give users a textarea they can
dump text into.

-David
First thanx for ur reply..
i clear my requirement now..

I ll have a button in page ... and when i click it .. content of a div
tag has to be get selected (i.e what we normally do with mouse to
selecting some part of a page).. then i can do CTRl+C to copy the
selected div content.. to paste it in MS Word or in any other external
application..

i ve tried the select + copy + paste sequence with the use of
temporary text area element to store the innerHTML of Div tag and
copied to Clipboard. but while pasting the selected content in MS word
it appears like the textual tags not html formatted.. but when u do the
same with mouse clicks and drags u get the formatted pasting in ms
word. why? is it possible to just let to user to select a div while
clicking a button, pressing ctrl+c to copy and paste the content in
another application(ms word etc)?.
Or do you want only a portion of the contents of the div tag?
the whole div has to be get selected .. and the div has a common id for
example let its id as "selectDiv"

Plz help me

Nov 22 '06 #5

David Golightly wrote:
visu wrote:
Hi this is a question asked in this group two years back..
No answer for this question till date.
now i am in the same situation of the questioner.. to find a solution
for this problem.

Can any one help me in this regard.?

The question is:
----------------------------------------------------------------------------------------------------
Wondering if anyone can tell me if it's possible to have Javascript
select the contents of a div tag with a unique id by clicking
somewhere in the contents of that div tag?

I want to make it as easy as possible for users to copy the contents
of the div tag for pasting in another page. So, instead of having them
use the mouse to drag the selection, which can sometimes be annoying,
I'd like to have them click anywhere within the div tag and have the
text automatically selected, and then they can simply right click and
select 'Copy'.

If this is possible, can anyone give me some advice on how to achieve
it?

As an alternative, if a div tag won't respond to an onClick event
itself, would it be possible to select the contents of that div tag
(assume, for eg, that it has the unique id of "Copy1") by clicking on
a button?

Any help with this would be much appreciated!
Much warmth,

Murray
----------------------------------------------------------------------------------------------------
thanx for both questioner and the person who is going to reveal a
solution for this.

This sounds like an incredibly ambitious project and it would help you
to first gain some experience with JavaScript/HTML on some more trivial
projects before tackling this. Once you do, you'll have some insight
into some of the questions that come up.

So, all div tags will respond no problem to an onclick event (always
call it onclick, never onClick - javascript is case-sensitive and so
is XHTML, so it's best to just adopt this convention). However, the
question is - *what* do you want copied. Do you want the entire
contents of a div tag? If so, then a recursive function is the way to
get the text of an element:

function getText(node) {
var txt = '';
if (node.nodeType == 3) // i.e. it's a text node
txt += node.nodeValue;

for (var i=0; i < node.childNodes.length; i++)
txt += getText(node.childNodes[i]);

return txt;
};

Or do you want the div tag itself? Then you can just clone the node:

var newNode = node.cloneNode(true); // optional argument is true if
you want to clone children as well

Or do you want only a portion of the contents of the div tag? How are
you going to have the user specify which portion is to be selected if
they just click once and aren't dragging?

Also, I would discourage you from trying to mess with the right-click
button. Browsers have control over the right-click context menu and
there is little you can do to turn that off reliably in all browsers.
Give them a "paste" button instead.

Alternativley, you might want to just give users a textarea they can
dump text into.

-David
First thanx for ur reply..
i clear my requirement now..

I ll have a button in page ... and when i click it .. content of a div
tag has to be get selected (i.e what we normally do with mouse to
selecting some part of a page).. then i can do CTRl+C to copy the
selected div content.. to paste it in MS Word or in any other external
application..

i ve tried the select + copy + paste sequence with the use of
temporary text area element to store the innerHTML of Div tag and
copied to Clipboard. but while pasting the selected content in MS word
it appears like the textual tags not html formatted.. but when u do the
same with mouse clicks and drags u get the formatted pasting in ms
word. why? is it possible to just let to user to select a div while
clicking a button, pressing ctrl+c to copy and paste the content in
another application(ms word etc)?.
Or do you want only a portion of the contents of the div tag?
the whole div has to be get selected .. and the div has a common id for
example let its id as "selectDiv"

Plz help me

Nov 22 '06 #6

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

12
by: Kevin Lyons | last post by:
Hello, I am trying to get my select options (courses) passed correctly from the following URL: http://www.dslextreme.com/users/kevinlyons/selectBoxes.html I am having difficulty getting the...
2
by: Mad Scientist Jr | last post by:
I'm trying to get javascipt select all items in a HTML form <SELECT> control and submit the form to an asp.net page. For some reason when the link is clicked, you can see the items all get...
13
by: Botao | last post by:
Hi, Every Guru, I'd like to put a button on a page. When clicking the button, the table below it gets selected so the user can do Ctrl C to copy the entire table without using the mouse to...
4
by: frogman042 | last post by:
My daughter is playing around trying to learn JavaScript and she wrote a small program that prints out a message in increasing and decreasing font size and color changes. She is using document...
2
by: VK | last post by:
A while ago there was a discussion how to implement a select list that would call a function right upon new selection is being made w/o clicking any additional buttons: ...
5
by: Alex | last post by:
Hello, I hope I can explain this properly. I'm writing an application with a tabbed-based navigation, and a form which gets filled out by users will be split into 5 subtabs. What I need is...
3
by: matwilko | last post by:
hi, i am trying to create a simple version of itunes...and i am using iframes to do this. I have already set up the iframes using dreamweaver and used a drop-down menu to select the genre. When...
1
by: ramya2611 | last post by:
hi I have the following scenario.. i have a select box containing a list of times. on selecting one of them i am dispalying all the details pertaining to that selection. the list is prone to...
0
by: lllomh | last post by:
Define the method first this.state = { buttonBackgroundColor: 'green', isBlinking: false, // A new status is added to identify whether the button is blinking or not } autoStart=()=>{
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 4 Oct 2023 starting at 18:00 UK time (6PM UTC+1) and finishing at about 19:15 (7.15PM) The start time is equivalent to 19:00 (7PM) in Central...
0
by: Aliciasmith | last post by:
In an age dominated by smartphones, having a mobile app for your business is no longer an option; it's a necessity. Whether you're a startup or an established enterprise, finding the right mobile app...
0
tracyyun
by: tracyyun | last post by:
Hello everyone, I have a question and would like some advice on network connectivity. I have one computer connected to my router via WiFi, but I have two other computers that I want to be able to...
4
NeoPa
by: NeoPa | last post by:
Hello everyone. I find myself stuck trying to find the VBA way to get Access to create a PDF of the currently-selected (and open) object (Form or Report). I know it can be done by selecting :...
1
by: Teri B | last post by:
Hi, I have created a sub-form Roles. In my course form the user selects the roles assigned to the course. 0ne-to-many. One course many roles. Then I created a report based on the Course form and...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 1 Nov 2023 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM) Please note that the UK and Europe revert to winter time on...
3
by: nia12 | last post by:
Hi there, I am very new to Access so apologies if any of this is obvious/not clear. I am creating a data collection tool for health care employees to complete. It consists of a number of...
0
isladogs
by: isladogs | last post by:
The next online meeting of the Access Europe User Group will be on Wednesday 6 Dec 2023 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, Mike...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.