I can print information out from JavaScript, how can I add the information to textbox

the following code displays information relation to description12 from JavaScript

<h6> Description : </h6>  <span id="Description12"> </span><br />

I am now trying to get the information into textbox

<input name="reportnoss" type="text" id="Description12">

which does not work.

I can print information out from JavaScript, how can I add the information to textbox

the following code displays information relation to description12 from JavaScript

<h6> Description : </h6>  <span id="Description12"> </span><br />

I am now trying to get the information into textbox

<input name="reportnoss" type="text" id="Description12">

which does not work.

• javascript
• html

Share Improve this question Follow edited Mar 13, 2013 at 1:08 hjpotter92 80.7k3636 gold badges148148 silver badges187187 bronze badges asked Mar 13, 2013 at 1:00 Muz ZadenMuz Zaden 3311 gold badge11 silver badge55 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 1

You can't give two controls on the same page identical IDs - they must be unique.

The ID you give the input text box should be for that control.

You will need to use javascript or jQuery to do this if you must do it client-side.

Something like:

document.getElementById("reportnoss").innerText=document.getElementById("Description12").innerText; would work if you gave the input field the ID reportnoss

As other answers say, you can't have same id.

<h6> Description : </h6>  <span id="Description12"> </span><br />

<input name="reportnoss" type="text" id="DescriptionTextBox">

Javascript to set the span's text to input text:

document.getElementById("DescriptionTextBox").value=document.getElementById("Description12").innerText;

Note you should use .value and not .innerText for input type="text"

If this is not what you were asking for leave a ment.

First, you cannot have 2 elements in the same document that have the same id. Remove the input's id or change it to another id.

<h6> Description : </h6>  <span id="Description12"> </span><br />
<input name="reportnoss" type="text" id="Input_Description12">

Then, to get the text in the textbox and put it into the span:

var txt = document.querySelector("#Input_Description12").value;  //get the text
document.querySelector("#Description12").innerText = txt;        //put it in

  -and the opposite-

var txt = document.querySelector("#Description12").innerText;
document.querySelector("#Input_Description12").value = txt;

Demo: http://jsfiddle/DerekL/bFZMb/

Method used:

• .querySelector
• .innerText