Can not fetch data from input field?

Question

When we paste data in input field, we can not fetch data from input field, it's always show blank;

function myFunction() {
      console.log(document.getElementById("inpt").innerText);
      document.getElementById("demo").innerHTML = document.getElementById("inpt").innerText;
}

<input id="inpt"  type="text" onpaste="myFunction()" value="Try to paste something in here" size="40">
    
<p id="demo"></p>

Possible duplicate of [JavaScript get clipboard data on paste event (Cross browser)](https://stackoverflow.com/questions/2176861/javascript-get-clipboard-data-on-paste-event-cross-browser) — Carl Binalla, Jun 07 '19 at 09:38
You could try something like this: https://stackoverflow.com/a/19269040/3918612 — Matt Walterspieler, Jun 07 '19 at 09:49

score 0 · Accepted Answer · answered Jun 07 '19 at 09:46

For Angular, try this:

Template:

<input id="inpt"  type="text" (paste)="myFunction($event)" value="Try to paste something in here" size="40">

TS:

myFunction(event: ClipboardEvent) {
      let clipboardData = event.clipboardData || window.clipboardData;
      let pastedText = clipboardData.getData('text');
      console.log(pastedText);
}

score 0 · Answer 2 · answered Jun 07 '19 at 09:59

0

You need to add setTimeout function for that.

function myFunction() {
    setTimeout(function(){
        document.getElementById("demo").innerHTML = document.getElementById('inpt').value;
    })
}

<input id="inpt"  type="text" onpaste="myFunction()" value="abc abc" size="40">
    
<p id="demo"></p>

answered Jun 07 '19 at 09:59

Chintan Kotadiya

1,335
1
11
19

you didnt add the reason as to why – Kunal Mukherjee Jun 07 '19 at 10:34

Can not fetch data from input field?

2 Answers2