How to enter text into a input without using input.value

Question

I have an existing app which requires a user to answer questions using an input box. I did not code this app and I do not want to mess around with the apps code. I have created a virtual on screen numpad from buttons which when pressed add the corresponding value to the input box using '.value'. This does 'work' and the numbers do appear in the input box but they are not saved by the existing code meaning that they mustn't be capturing the '.value'.

Is there some easy way of essentially.. simulating a user inputting text

function geet (clicked_value) {
var input = document.querySelector(".pt-subpage-current input");
if (input.value.length < 3) {
input.value += clicked_value;
}
}
function removeValue() {
var input = document.querySelector(".pt-subpage-current input");
var length = input.value.length;
if (length > 0) {
input.value = input.value.substring(0, length-1);
}
}





<input type="button" onClick="geet(this.value)" value="7" class="button 
number" id="num7" />

_Is there some easy way of essentially.. simulating a user inputting text_ you may check this: https://stackoverflow.com/questions/596481/is-it-possible-to-simulate-key-press-events-programmatically . Is simulating an input required? What's wrong with your example? it seems to work properly, to me. — briosheje, Apr 30 '19 at 10:12
because the app doesn't save questions answered using .value for some reason. but it does if i type it in manually. — meowth, Apr 30 '19 at 10:13
that largely depends what the app is doing, it would be useful to see what it does to acquire the result. Usually, simulating an `input` event is enough, like this: https://jsfiddle.net/pxawvL62/ . beware of browsers compatibility, though. — briosheje, Apr 30 '19 at 10:17
Does it accept it without pressing enter if you type it manually, or do you need to press enter? — Comet, Apr 30 '19 at 10:30
you do not need to press enter, the code above doesn't work sadly. — meowth, Apr 30 '19 at 10:34

Comet · Answer 1 · 2019-04-30T10:19:56.333

1

I literally just made a numpad for someone here. all you need to do is use the showKeyPad() in an onclick event and give the fields id's. Let me know if you need help.

EDIT: Sorry just realized you said it is not saving .value. This keypad uses the .value.

edited Apr 30 '19 at 10:19

answered Apr 30 '19 at 10:14

Comet

260
2
8

Hi, its not about making the keypad its about the method of input as using .value isn't working but typing it manually is. – meowth Apr 30 '19 at 10:19
So, sorry. yes I just understood the question as i was reading comments – Comet Apr 30 '19 at 10:20

score 1 · Answer 2 · answered Apr 30 '19 at 10:15

You can use div with content editable true ,if that works for you.This is for your simulating part in your question

function edit()
{
let te=document.getElementById("textdiv").textContent;

console.log(te)
}

<div id="textdiv" contenteditable="true">Hello, edit me!</div>

<button onclick="edit()">Button</button>

How to enter text into a input without using input.value

2 Answers2