Copy table cell text into an input as value attribute

charles-brewster

I'm trying to write a simple JavaScript function which will use a
button to copy table cell data into a form input text box as the
"value" attribute.

The following is intended to test the function, but doesn't work. I'm
new to this - previous JavaScript experience mostly copy & paste -
could somebody please point to where I'm going wrong.

~~~~~~~~~~~~~~~ ~~~~~~~~~~
<head>
<title>Testin g JavaScript</title>
<script language="JavaS cript">
function copytext(source _id, dest_id)
{
var s = getElementById( source_id);
var d = getElementById( dest_id);
var text = s.innerText;

d.setAttribute( "value", text);
}
</script>
</head>
<body>
<h1>Testing JavaScript</h1>
<form>
<table>
<tr>
<td id="cell1">
<b>a string of text</b>
</td>
<td>
<button onclick="copyte xt('cell1', 'input1')">>></button>
</td>
<td>
<input type="text" id="input1" width="20">
</td>
</tr>
</table>
</form>
</body>
</html>

~~~~~~~~~~~~~~~ ~~~~~~~~~~~~~~~ ~~~~~

Many thanks for any helpful suggestions

CB

Jun 22 '06 #1

Subscribe Reply

13933

RobG

ch************* *@ntlworld.com wrote:

I'm trying to write a simple JavaScript function which will use a
button to copy table cell data into a form input text box as the
"value" attribute.

The following is intended to test the function, but doesn't work. I'm
new to this - previous JavaScript experience mostly copy & paste -
could somebody please point to where I'm going wrong.

~~~~~~~~~~~~~~~ ~~~~~~~~~~
<head>
<title>Testin g JavaScript</title>
<script language="JavaS cript">
The language attribute is deprecated, type is required:

<script type="text/javascript">

function copytext(source _id, dest_id)
{
var s = getElementById( source_id);
Please don't indent using tabs when posting, use 2 (preferred) or 4 spaces.

getElementById is a method of the DOM 2 Core document interface:

var s = document.getEle mentById(source _id);

It is also best to test features that may not be supported by some browsers:

if (document.getEl ementById){
var s = document.getEle mentById(source _id);
...
var d = getElementById( dest_id);
var d = document.getEle mentById(dest_i d);

var text = s.innerText;
The innerText property is IE proprietary and not widely implemented.
The W3C equivalent is textContent, which naturally isn't implemented by
IE. Alternative utilities have been posted here, search the archives
for 'innerText textContent'.

d.setAttribute( "value", text);
setAttribute is known to be a bit buggy on some browsers - though I
don't think there should be a problem here. Anyhow, it's much simpler
to write:

d.value = text;

}
</script>
</head>
<body>
<h1>Testing JavaScript</h1>
<form>
The action attribute is required for HTML forms, even if it has no value:

<form action="">
[...] <button onclick="copyte xt('cell1', 'input1')">>></button>

Inside a form, a button element is by default a submit button. So even
if the value is copied to the input, the form is posted to the current
page, causing it to re-load and clear the value.

<URL:http://www.w3.org/TR/html4/interact/forms.html#edef-BUTTON>
If you don't want it to be a submit button, give it a type attribute
value of 'button'. Anyhow, it seems better to use an input with
type="button" and avoid the issue:

<input type="button" value=">>"
onclick="copyte xt('cell1', 'input1')">

[...]

--
Rob

Jun 22 '06 #2

joepixel

New Member

Not sure if you ever found your answer, but this will work in IE and Firefox:

<html>
<head>
<title>Testin g JavaScript</title>
<script language="JavaS cript">
function copytext(source _id, dest_id) {
var s = document.getEle mentById(source _id);
var d = document.getEle mentById(dest_i d);
d.value=s.inner HTML;
}
</script>
</head>
<body>
<h1>Testing JavaScript</h1>
<form>
<table>
<tr>
<td id="cell1">a string of text</td>
<td><input type="button" value=">>" onclick="copyte xt('cell1', 'input1')" /></td>
<td><input type="text" id="input1" width="20"></td>
</tr>
</table>
</form>
</body>
</html>

Jul 13 '06 #3

Similar topics

9927

Text input value equal to a variable

by: JeffFinnan | last post by:

Is there a way to have a text input field equal some variable value so that it changes if that variable changes? It does not have to by dynamic. <INPUT TYPE="TEXT" NAME="hW" size="4" value=some variable> Thanks, Jeff

Javascript

6183

How to change table cell text on <TD> mouseover

by: Pete Kipe | last post by:

I'm not a JavaScript programmer...but I'm trying to put together a simple menu system for a new website and need a little help. I have the following script: <SCRIPT language=javascript> <!-- Hide JavaScript from Java-Impaired Browsers function NavRollOver(oTd) {if (!oTd.contains(event.fromElement)) {oTd.bgColor="#CC0000";}} function NavRollOut(oTd) {if (!oTd.contains(event.toElement))

Javascript

16202

Change table cell text alignment?

by: harry | last post by:

I want to be able to change the text alignment within a table cell between "right" & "center" depending on how many rows are in the table. Is this possible in Javascript? - can't see how to do it! thanks harry

Javascript

1077

Copy Table from Text File; Start at Line Number X Rather than at Beginning of File

by: John Alexander | last post by:

Hi, I have a text file I need to import into Postgres, v. 7.2. The file has a header row. I want to begin the import at the line below the header row. Is this possible, or will I have to strip the header row from the file prior to the import? If it is possible, what flag do I use in the COPY command?

PostgreSQL Database

1051

Table Cell text position

by: Mark A. Sam | last post by:

Hello, Whenever I add a table, the text position of the cells is centered. I would like the default to be left-top. Is there a way to set this? Thank you and God Bless, Mark A. Sam

ASP.NET

1874

Still trying to copy table cell text into an input as value attribute

by: charles-brewster | last post by:

I have progressed the copytext function test page a little since my original post here in the small hours this morning. It now opens a debugging window so I can try to figure out what it is or isn't doing. Current version of the test page: ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ <head> <title>Testing JavaScript</title> <script language="JavaScript">

Javascript

1920

How to get a text input value into a php script

by: Todor Vachkov | last post by:

Dear all, here is the code: ----------------------------- <tr> Â Â Â Â <td>ohne Anmeldung: </td> Â Â Â Â <td><input name="vanm" id="vanm" type="checkbox" onclick="DisableTeilnehmerzahl()"></td> </tr> <tr>

Javascript

2444

Wrap inner table cell text with mailto...

by: asafok | last post by:

hi, i'm tring to get access to a cell inside a table that has the vlaue of an Email address but is not clickable. i tring to go to that cell and Wrap the inner text with <a href="mailto... tag so it would be clickable. i tried to use this code: x=document.getElementById('GridView1').childNodes.childNodes; but with no luck,for some resone i can't access the cell and it's text. need you help on doing so...

Javascript

2893

set text input value onclick etc

by: ukfusion | last post by:

Hi, Its something stupidly simple but for some reason i cant find a straight forward cross browser solution. I've got 2 sets of address fields and i want a tick box that when the user clicks it populates the 2nd lot of boxes with the values in the first. I had it working in I.E ok using the following; document.getElementById("inputid2").value=document.getElementById("inputid1").value;

Javascript

9650

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...

General

9497

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...

Windows Server

10363

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...

C / C++

10110

The easy way to turn off automatic updates for Windows 10/11

by: Hystou | last post by:

Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...

Windows Server

7515

Access Europe - Using VBA to create a class based on a table - Wed 1 May

by: isladogs | last post by:

The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...

Microsoft Access / VBA

6748

Couldn’t get equations in html when convert word .docx file to html file in C#.

by: conductexam | last post by:

I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one. At the time of converting from word file to html my equations which are in the word document file was convert into image. Globals.ThisAddIn.Application.ActiveDocument.Select();...

C# / C Sharp

5534

Windows Forms - .Net 8.0

by: adsilva | last post by:

A Windows Forms form does not have the event Unload, like VB6. What one acts like?

Visual Basic .NET

4067

transfer the data from one system to another through ip address

by: 6302768590 | last post by:

Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system

C# / C Sharp

2894

Comprehensive Guide to Website Development in Toronto: Expert Insights from BSMN Consultancy

by: bsmnconsultancy | last post by:

In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

General