Change Textarea and Input with onclick

Question

I would like to change the value of a textarea and an input field. The whole thing should happen with an onclick. Unfortunately, my approach seems to be wrong. I would be happy about tips.

        <textarea class="input" name="adresse" readonly="readonly" id="street" value="test"></textarea>
        <input style="width:130px;text-align: left" class="input" type="text" name="kundennr" id="kundennr" value="10000">

                                <?php
$sql = "SELECT * FROM `kunde` ORDER BY `kundennummer` ASC";

foreach ($dbh->query($sql) as $nav) {

$address = $nav['adresse']; 
$name = $nav['kundennummer'];

echo " 
<input type='text' name='textfield' id='textfield$name' value='$address'>
<a> |  Kundennr: </a><a href='#' id='text' onclick='updateTxt(this);' >$name</a><br>
";

    }

?> 

    </div>
</div>

    <script>
    function updateTxt(el)
  {  
    var inhalt = el.text;
    var field2 = document.getElementById('textfield'+inhalt).value; 
 document.getElementById('kundennr').value =inhalt;
 document.getElementById('street').innerHTML = field2;
    }  
    </script>

Update:

Thanks to all I found the solution

"Unfortunately, my approach seems to be wrong" Why? What happens when you run what your code? What doesn't? What did you expect? — Lazar Ljubenović, Sep 27 '18 at 18:40
Can you explain what is textfield, text, kundennr, street in your code. — Shubham Gupta, Sep 27 '18 at 18:40
Possible duplicate of [Change an element's class with JavaScript](https://stackoverflow.com/questions/195951/change-an-elements-class-with-javascript) — beefoak, Sep 27 '18 at 18:42
Where is your textarea element with `id="text"` that you are querying ? — Jonathan Hamel, Sep 27 '18 at 18:44
Possible duplicate of [Set Value of Input Using Javascript Function](https://stackoverflow.com/questions/5700471/set-value-of-input-using-javascript-function) — Mark Carpenter Jr, Sep 27 '18 at 18:53
In your code // var field2 = document.getElementById('text').value; // the text id associated with button, if you are trying to get the value of button you should change the code to the following var field2 = document.getElementById('text').textContent; — KUMAR, Sep 27 '18 at 18:56

score 0 · Answer 1 · answered Sep 27 '18 at 18:47

I think you are looking for how to update an textarea value with JS. It is not the same as input field and can be done like this;

document.getElementById('myTextarea').value = ''New value";

where textarea is:

<textarea id="myTextarea">Initial value, will be overwritten</textarea>

Aagam Jain · Accepted Answer · 2018-09-28T06:48:58.900

Sorry, But can't run PHP code here so added dummy data as your PHP code will render.

This should work:

function updateTxt(el) {

  var inhalt = el.innerHTML;
  var field2 = document.getElementById('textfield' + inhalt).value;
  document.getElementById('kundennr').value = inhalt;
  document.getElementById('street').innerHTML = field2;
}

<textarea class="input" name="adresse" cols=50 rows=10 readonly="readonly" id="street" value=""></textarea>
<input style="width:130px;text-align: left" class="input" type="text" name="kundennr" id="kundennr" value="">

<!-- <?php
$sql = "SELECT * FROM `kunde` ORDER BY `kundennummer` ASC";

foreach ($dbh->query($sql) as $nav) {

$address = $nav['adresse']; 
$name = $nav['kundennummer'];

echo " 
<input type='text' name='textfield' id='textfield$name' value='$address'>
<a> |  Kundennr: </a><a href='#' id='text' onclick='updateTxt(this);' >$name</a><br>
";

    }

?> -->

<input type="text" name="textfield" id="textfieldstreet1" value="Add1..">
<a> |  Kundennr: </a><a href="#" id="text" onclick="updateTxt(this);">street1</a><br>

<input type="text" name="textfield" id="textfieldstreet2" value="Add2...">
<a> |  Kundennr: </a><a href="#" id="text" onclick="updateTxt(this);">street2</a><br>

<input type="text" name="textfield" id="textfieldstreet3" value="Add3...">
<a> |  Kundennr: </a><a href="#" id="text" onclick="updateTxt(this);">street3</a><br>

<input type="text" name="textfield" id="textfieldstreet4" value="Add4...">
<a> |  Kundennr: </a><a href="#" id="text" onclick="updateTxt(this);">street4</a><br>

I edit my code. With PHP i get more Customers and i want Select the customer and change the value on Textarea with "street" and Input with "kundennr" — Maximum, Sep 27 '18 at 19:23

Change Textarea and Input with onclick

2 Answers2