...

View Full Version : selecting a table cell's contents?



greenham
09-24-2005, 12:00 PM
Hey guys,

This is my first time here and by the looks of things, itís a really good forum to get some information. Now, I have already searched the forum and have not found anything that will answer my question, but if I have overlooked anything, I apologise.

Now, what I want to do is use the 'document.something.select();' command to select the contents of a tableís cell. Is this possible? Judging by my experimentation with the code, I don't think it is, but I could be wrong. :)

If this is in fact not possible, could someone please suggest how I can code the page so when an image is clicked upon, a URL is copied to the clipboard. (As it is, this URL is in a table cell. But I would prefer it if I didn't have to have the actual URL displayed on the page at all.)

Finally, I wish to do with this with multiple images, so if any information is relevant to using the same code several times in the one page, or if there is a way to reduce the amount of code required, I would appreciate hearing it.

Thanks all for at least reading my post. :)

CrAzY_J
09-24-2005, 02:25 PM
document.getElementById('TableCell').innerHTML='URL or w/e';

use the .innerHTML

greenham
09-25-2005, 03:23 AM
Thank you for replying CrAzY_J, I really appreciate it! But I am afraid I will need a little more assistance. I have tried to implement this this code into my html document, but I do not seem to understand enough of it to get it to function correctly. Please, if you could take a look at my source and point me in the right direction?



<html>
<head>
<title>Testing Document</title>
</head>

<body>
<script type="text/javascript">

function CopyToClipboard()

{

document.table.focus();

document.table.select();

document.getElementById('TableCell').innerHTML='URL or w/e';

CopiedTxt = document.selection.createRange();

CopiedTxt.execCommand("Copy");

}

</script>

<form name="Form1">

<input type="button" onClick="CopyToClipboard()" value="Copy to clipboard" />

</form>

<table width="75%" border="1" align="center" id="table">
<tr>
<td id = "TableCell">hehe</td>
</tr>
</table>

</body>

</html>


In particular, I don't know what to do with the bold section and I asume I must insert another line of code for this to work at all, but I am not sure what it should be. :(

CrAzY_J
09-25-2005, 04:55 AM
It doesn't seem like there's anything wrong with it...

Maybe if you're using firefox, the createRange() method is none cross browser. Perhaps that's why..

greenham
09-25-2005, 08:19 AM
Nope, I am using IE. Perhaps this will help, I am recieving the following error message . . .

http://img5.picsplace.to/img5/5/error_000.JPG

CrAzY_J
09-25-2005, 04:26 PM
document.table.focus();

document.table.select();

document.getElementById('tableid').focus();
document.getElementById('tableid').select();

greenham
09-26-2005, 05:05 AM
Hey, thankyou so much for your continued help. But I am still doing something wrong. :( Sorry if my inability is annoying you. I admit I do not have as great an understanding of javascript as I would like. I think my problem is to do with the naming of my table and it's cells.

Here is the error message I am getting when I click on the button that should copy the cell's contents . . .

http://img6.picsplace.to/img6/1/displayerror.JPG

And here is the entire code I am using . . .


<html>
<head>
<title>Testing Document</title>
</head>

<body>
<script type="text/javascript">

function CopyToClipboard()

{
document.getElementById('tableid').focus();

document.getElementById('tableid').select();

document.getElementById('TableCell').innerHTML='http://www.url.com';

CopiedTxt = document.selection.createRange();

CopiedTxt.execCommand("Copy");

}

</script>

<form name="Form1">

<input type="button" onClick="CopyToClipboard()" value="Copy to clipboard" />

</form>

<table width="75%" border="1" align="center" id="table">
<tr>
<td>cell one</td>
</tr>
</table>

</body>

</html>

greenham
09-27-2005, 05:05 AM
:( it appears you have finally given up on me. Please, can anyone help me out?

Lerura
09-27-2005, 06:05 PM
since your table's ID is "table" you must replace ...getElementById('tableid')...
with your table's ID so it be ...getElementById('table')...

greenham
09-28-2005, 01:54 AM
I love you lerura for helping me out :)

That seems to have fixed the problem, silly me. I didn't realise I had to change that. (Yes I know, it's pretty self-explanitory. :()

But now I am encountering the original error message I faced. :( Which is . . .

http://img4.picsplace.to/img4/7/error3.JPG

I wont bother posting the script again, it is exactly the same with the suggested changes.

Edit: Hey, to make things easier, I thought I should point out that line 13 is the following . . .

document.getElementById('table').focus();

rm-f
09-28-2005, 02:08 AM
Excellent solution for all your questions:

http://images.amazon.com/images/P/0764502239.01._BO2,204,203,200_PIsitb-dp-500-arrow,TopRight,45,-64_AA240_SH20_SCLZZZZZZZ_.jpg

Lerura
09-28-2005, 08:13 PM
"focus()" and "select()" is meant to be used while working with
<input type="text">
and
<textarea>

focus() is moving the textcursor to the textbox
and
select() is then selecting the content of that textbox

as far as know it is not supported anywhere else.

the way u could solve your problem is by making a textarea that contains a copy of the coding of what you want to be copied to CB

and when using the button the content of the textarea can be focus()ed and select()ed

the user can then copy it to CB



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum